在網頁設計中，經常會遇到文字過長的情況，如果不處理的話，會導致網頁排版雜亂無章，影響美觀度和閱讀體驗。這時候我們可以使用CSS樣式讓文字自動折行，讓排版更加美觀。 CSS中有一個屬性叫做word-wrap，它的作用就是控制超出邊界的文本如何換行。默認情況下，如果一行文本超出了容器的寬度，它將會溢出容器并覆蓋其他元素，造成排版混亂的效果。而當我們?yōu)槿萜髟O置word-wrap屬性時，文本就會自動折行，保證整個頁面的布局更加清晰。 下面我們來看一個例子。首先，我們需要先設置容器的寬度，如下所示：

<style>
.container{
width: 500px;
}
</style>

然后，在容器中加入長文字，如下所示：

<div class="container">
<p>
這是一段很長很長的文字，如果不進行處理，就會導致網頁排版雜亂無章，影響美觀度和閱讀體驗。
</p>
</div>

接下來，我們給容器設置word-wrap屬性，如下所示：

<style>
.container{
width: 500px;
word-wrap: break-word;
}
</style>

其中，break-word表示在單詞中斷處進行換行。 這樣我們就完成了文字自動折行的操作。運行結果如下：總之，使用CSS控制文字自動折行可以讓網頁排版更加美觀，提高用戶的閱讀體驗。在實際應用中，我們還可以使用其他屬性如text-overflow來增強文字折行時的展示效果，讓網頁更加出色。