CSS對于頁面的布局及其樣式設置起著重要的作用。其中，內容溢出自動換行則是CSS中一個非常重要且實用的特性。 在平時的網頁開發中，經常可能會遇到一些內容比較長的情況，比如長段落、長標題、長鏈接等等。當這些內容過長時，會導致頁面布局出現問題，甚至影響到整個頁面的美觀度。這時我們就需要使用CSS的自動換行功能來解決問題。 自動換行的實現方式很簡單，只需要在對應的元素上添加一個“word-wrap:break-word”屬性即可。這個屬性表示讓瀏覽器自動將超出容器寬度的內容自動換行，并且保證每一行開始的單詞都是完整的。 下面是一個實例，我們將一個超出容器寬度的段落進行自動換行的設置：

p {
width: 300px;
border: 1px solid #000;
word-wrap: break-word;
}

這是一段超過300px寬度的內容：xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

通過設置“word-wrap:break-word”屬性，可以看到段落的內容已經自動換行，并且每一行的開始都是完整的單詞，整個頁面的布局也不會受到影響了。 除了“word-wrap:break-word”屬性外，還有一個類似的屬性叫做“overflow-wrap:break-word”。它與“word-wrap:break-word”作用相同，可以使超出容器寬度的內容自動換行。但是，它的換行方式更安全，不會在單詞中間斷行，保證了整個頁面的美觀度。 無論是“word-wrap:break-word”還是“overflow-wrap:break-word”，它們都是非常常用的CSS屬性。在日常的網頁開發中，遇到內容超出容器寬度的情況，使用這兩個屬性可以讓我們更加輕松地解決這個問題。