在網(wǎng)頁設(shè)計中，有時需要對內(nèi)容進行限制，比如限制一段文字的行數(shù)不超過某個值。為了實現(xiàn)這一目的，我們可以使用 CSS 的屬性來設(shè)置行數(shù)隱藏。

.text {
overflow: hidden; /* 隱藏溢出部分 */
text-overflow: ellipsis; /* 使用省略號代替被隱藏的內(nèi)容 */
display: -webkit-box; /* 將元素渲染為彈性伸縮盒子 */
-webkit-line-clamp: 3; /* 限制元素內(nèi)文本的行數(shù) */
-webkit-box-orient: vertical; /* 設(shè)置伸縮盒子元素的子元素在垂直方向堆疊 */
}

上述代碼將一段文本限制在三行以內(nèi)，并使用省略號代替被隱藏的部分。如果想要顯示更多的行數(shù)，只需要將-webkit-line-clamp的值設(shè)置為對應(yīng)的行數(shù)即可。

這種方式與直接使用 JavaScript 截取字符串不同，可以保持完整單詞的顯示，更符合閱讀習(xí)慣。