在開發網站時，我們經常需要在頁面中顯示大段的文本內容。但是，有些時候我們希望在該文本內容中只顯示部分文字，例如只顯示前100個字符。這時，我們可以使用CSS的text-overflow屬性來實現這個功能。

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

上述代碼中，我們首先給該段落設置最大寬度為500px，這是因為如果內容太寬，就沒必要截取部分內容了。之后，我們設置了white-space屬性為nowrap，這是因為我們在截取的時候不能讓文字換行，否則截取效果就不準確了。

接下來，我們設置了overflow屬性為hidden，這是因為我們要隱藏沒有被截取的部分內容。最后，我們設置了text-overflow屬性為ellipsis，這表示在截取內容的末尾顯示省略號。

有時候我們可能還需要截取后文字的樣式有所改變，例如我們可能需要將截取的內容加粗或者設為斜體。在這種情況下，我們可以使用偽元素::after來實現這個功能。例如：

p::after {
content: "...";
font-weight: bold;
font-style: italic;
}

上述代碼中，我們使用content屬性來設置文字內容為省略號。之后，我們設置了font-weight和font-style屬性為bold和italic，這樣就可以將省略號的樣式改變了。