用css限制文字的行數

此文章已於 2024-01-04 更新

在文字編排的時候,我們都會區塊呈現文章列表,然後節錄出標題、摘要,通常有在注意字數的話是沒問題的。

如果字數不一樣就會讓整體視覺觀感沒那麼漂亮,這邊就提供一個可以將多餘內容隱藏並變為「…」的方式。

在要限制的文字內容是用下面css

.class{
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 5;
overflow: hidden;
}