CSS 的一大優點是可以對網頁中的文字進行微調。不過，有時候我們想限制文字的行數或字數，該怎么實現呢？下面就讓我們來了解一下 CSS 中的限制行數和字數的方法。 限制行數 在 CSS 中，可以使用 “line-height” 屬性來設置行高。行高指的是文字行的高度，包括文字本身和上下間隔的空間。一般情況下，我們將其設置為文字大小的 1.5 倍左右，可以讓排版更加美觀。 如果我們想要限制文字的行數，可以使用 “line-clamp” 屬性。該屬性可以設置文字顯示的行數，如“line-clamp:2” 表示只顯示兩行文字。同時，我們還需要為容器設置 “display: -webkit-box;” “-webkit-box-orient: vertical;” 和 “overflow: hidden;” 這三個屬性，來保證文字按照預想的行數顯示。下面是一個例子：

p {
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden;
-webkit-line-clamp: 2;
line-height: 1.5;
}

上述樣式表中，“p” 表示我們要對段落進行限制，將其顯示為一個容器。其中 “-webkit-box-orient: vertical;” 表示容器內的內容按照垂直方向排列，“-webkit-line-clamp: 2;” 表示限制容器內最多顯示兩行文字。 限制字數 如果想要限制文字的字數，可以使用 “text-overflow” 屬性。該屬性在文字超出容器時，可以設置不同的顯示方式，如省略號、文字溢出等。我們可以設置其值為“ellipsis”，表示使用省略號來表示文字超出容器。同時，還需要設置 “white-space: nowrap;” 和 “overflow: hidden;” 這兩個屬性，使文字不會自動換行，而是在容器內自動截斷。以下是樣式的示例：

p {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 200px;
}

上述代碼中，“max-width” 屬性指定了容器的最大寬度，當文字超出這個寬度時就會被截斷。同時，“text-overflow: ellipsis;” 表示如果文字超出，使用省略號來表示。最后，“white-space: nowrap;” 和 “overflow: hidden;” 兩個屬性表示容器內的文字禁止自動換行，超出部分被截斷。 總結 限制行數和字數在網頁排版中非常有用。通過應用 “line-clamp” 和 “text-overflow” 屬性，可以很容易地實現這兩種效果。當然，還有其他方法可以達到類似的效果，需要根據具體情況來選擇合適的方法。