在網頁設計中，文字的排版是非常重要的。而有些情況下，我們希望一段文字能夠自動折行，以適配不同的屏幕大小。這時候，我們可以借助CSS中的word-wrap和word-break屬性來實現。 word-wrap屬性用于設置是否允許在單詞內部換行，默認值為normal。而如果我們將其設置為break-word，則可以實現單詞自動換行的功能，即當一行無法容納下整個單詞時，單詞會被強制分為兩行。 下面是一個使用word-wrap屬性實現自動折行的例子：

p {
width: 100px;
word-wrap: break-word;
}

在上述例子中，我們通過設置p元素的寬度為100px，并將word-wrap屬性設置為break-word，來實現了文字自動折行的效果。此時，當p元素內的文字超出100px的范圍時，文字就會自動折行，以保證整段文字能夠全部顯示出來。 需要注意的是，word-wrap屬性只是針對單詞內部的自動折行，如果我們希望將一個長句子在兩個單詞之間斷開，則可以借助word-break屬性來實現。word-break屬性有三種取值：normal、break-all和keep-all。其中，break-all取值可以實現將長句子在單詞間自動斷開的效果。 下面是一個使用word-break屬性實現自動折行的例子：

p {
width: 100px;
word-wrap: break-word;
word-break: break-all;
}

在上述例子中，我們在上一個例子的基礎上，又新增了一個word-break屬性的設置。這樣設置后，當p元素中的一個長句子無法在當前行完全顯示時，它就會自動在兩個單詞之間斷開換行。 綜上所述，通過使用CSS中的word-wrap和word-break屬性，我們可以輕松實現文字的自動折行功能，提高網頁排版的美觀度和可讀性。