在網(wǎng)頁設(shè)計中，使用省略號可以有效地減少頁面的大小，并且簡化設(shè)計。CSS中的省略號可以讓文本在元素內(nèi)部顯示省略號，表現(xiàn)為簡短的提示。然而，在某些情況下，我們可能會遇到超出行時導(dǎo)致省略號無法顯示的問題。

/*常見省略號樣式*/
.ellipsis {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}

上面的 CSS 樣式是處理省略號的常見方式。但是，如果一行文本太長超出了容器的寬度，那么即使使用這個樣式也不會顯示省略號。

為了解決這個問題，我們可以使用line-clamp屬性。

.ellipsis {
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
/* 限制顯示行數(shù) */
-webkit-line-clamp: 2;
}

line-clamp屬性是一個在 WebKit 內(nèi)核下的屬性，它可以在元素的CSS樣式中表示最多顯示幾行文本并且省略其余部分的方法。使用這個屬性，我們可以將超出行數(shù)的文本截斷并在末尾加上省略號，從而使其始終適合容器的大小。

總結(jié)一下，當(dāng)文本超過了容器的大小并導(dǎo)致省略號失效時，使用 CSS 的line-clamp屬性可以幫助我們解決這個問題。