在進(jìn)行網(wǎng)頁設(shè)計(jì)的過程中，有時(shí)候需要控制某個(gè)元素中顯示的文字?jǐn)?shù)量，比如只希望展示一定長(zhǎng)度的標(biāo)題或簡(jiǎn)介，超出部分則需要省略。這時(shí)候，我們就可以用到CSS中的文本溢出控制。

常用的文本溢出控制方式有兩種：一種是使用display屬性和overflow屬性，將超出部分隱藏；另一種則是使用text-overflow屬性，將超出部分用省略號(hào)（...）代替。

/*使用display屬性和overflow屬性控制文本溢出*/
p {
display: -webkit-box;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
/*顯示兩行文字*/
}
/*使用text-overflow屬性控制文本溢出*/
p {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
/*超出部分用省略號(hào)顯示*/
}

通過上面的代碼，我們可以看出，在使用display屬性和overflow屬性時(shí)，需要將元素的display屬性設(shè)置為“-webkit-box”，并將overflow屬性設(shè)置為“hidden”，同時(shí)設(shè)置-webkit-box-orient屬性控制文本的方向及行數(shù)，-webkit-line-clamp來控制行數(shù)。這種方法的缺陷是只在webkit內(nèi)核的瀏覽器中適用。

而如果使用text-overflow屬性，則只需將元素的white-space屬性設(shè)為“nowrap”，overflow屬性設(shè)為“hidden”，text-overflow屬性設(shè)為“ellipsis”，就可以實(shí)現(xiàn)文本溢出時(shí)的省略號(hào)顯示效果。這種方法適用于大部分瀏覽器，但是需要注意的是，只有在元素寬度固定的情況下才能生效。

綜上所述，控制文本溢出的方式有很多種，選擇合適的方法可以讓我們的網(wǎng)頁元素顯示得更加美觀和實(shí)用。