在網頁設計中，我們常常需要將一些長篇文字進行縮略，以節約頁面空間，提高頁面美觀度。在CSS中，可以使用text-overflow屬性實現多行文字的縮略。

text-overflow屬性有三個值：ellipsis、clip和string。其中，我們最常使用的是ellipsis，代表省略號，在之后的文章中我們將重點講解這個值。

// 先給一個包含多行文字的容器進行樣式設置
.container{
width: 300px;
line-height: 1.5;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
// 其中，-webkit-box-orient: vertical; 代表將容器中的元素垂直排列。另外，-webkit-line-clamp: 3;代表顯示3行文本，超出部分將以省略號表示。

上面的代碼演示了如何實現三行文字縮略。在實際應用中，可以根據需要進行調整，改變容器的width和-webkit-line-clamp屬性值即可。

值得注意的是，text-overflow屬性只在使用了overflow:hidden屬性時才生效，因為其實現方式是將文本溢出的部分隱藏掉，只顯示容器中設置的內容區域。因此，如果不想出現省略號，可將text-overflow的值設置為clip。