CSS是一種強大的樣式語言，可以控制網頁的外觀和布局。在網頁設計中，經常需要隱藏多余的文字，以便更好地呈現信息。CSS提供了多種方法來實現這個目標，其中包括多行隱藏多余文字。

/* 隱藏多余文字 */
.overflow-ellipsis {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
/* 兼容性處理 */
.overflow-ellipsis::after {
content: "...";
position: absolute;
right: 0;
bottom: 0;
padding: 0 20px 1px 45px;
background: -webkit-gradient(linear, right top, left top, from(transparent), to(white));
background: linear-gradient(to left, transparent, white);
}

這段代碼定義了一個樣式類`.overflow-ellipsis`，它可以隱藏多余的文字并在末尾添加省略號。它使用了一些CSS屬性：

• `overflow: hidden`：將多余的內容隱藏。
• `text-overflow: ellipsis`：在文本末尾添加省略號。
• `display: -webkit-box`：將元素轉換為彈性容器。
• `-webkit-line-clamp: 3`：限制容器內文本的行數為3。
• `-webkit-box-orient: vertical`：使文本垂直排列。

但是，這個方法只在Chrome和Safari瀏覽器上生效。為了使其兼容其他瀏覽器，我們需要添加一個偽元素來模擬省略號的效果。

在這個例子中，我們使用了`::after`偽元素來添加省略號。它的位置是絕對定位，位于容器的右下角。它的背景采用了漸變效果，以使其看起來更自然。

可以通過給HTML元素加上這個樣式類來實現多行隱藏多余文字的效果：

<div class="overflow-ellipsis">
<p>這里是一些很長很長的文字，我們只想顯示它的前三行。</p>
</div>

總的來說，CSS的多行隱藏多余文字方法非常有用，并且可以輕松實現。只需要加上一些簡單的CSS屬性，就可以讓網頁更加美觀和易讀。