在網(wǎng)頁設(shè)計(jì)中，經(jīng)常需要將一段文本放在一個固定寬度的容器中，但是文字的長度可能會超出容器的寬度。這時，就需要使用 CSS 去控制文字自動換行。 在 CSS 中，我們可以通過“word-break”和“white-space”兩個屬性來實(shí)現(xiàn)字體自動換行。其中，“word-break”用于控制單詞換行時的處理方式，而“white-space”則用于控制元素內(nèi)空白的處理方式。 下面是一個例子，其中使用了一個寬度為 200 像素的 DIV 元素，并將其中的文字內(nèi)容設(shè)置為“Hello，這是一段需要自動換行的文本”。為了實(shí)現(xiàn)文字自動換行，我們設(shè)置了 CSS 樣式中的 “word-break” 和 “white-space” 屬性為“break-all”和“normal”：

<div style="width:200px;border:1px solid black;padding:5px">
<p style="word-break:break-all;white-space:normal;font-size:14px;line-height:1.4">
Hello，這是一段需要自動換行的文本。
</p>
</div>

其中，設(shè)置 “word-break” 為“break-all” 表示單詞將被強(qiáng)制斷行，不會出現(xiàn)超出容器寬度的單詞。同時，我們還將 “white-space” 設(shè)置為“normal”，這樣會忽略多余的空白，使得文本能夠自動換行。 除了以上兩個屬性，我們還可以使用其他一些屬性來實(shí)現(xiàn)文字自動換行，例如：設(shè)置“text-wrap”屬性為“normal”、“word-wrap”屬性為“break-word”等等。 總之，在網(wǎng)頁開發(fā)過程中，掌握 CSS 控制文字自動換行的技巧是非常重要的，它可以為我們的網(wǎng)頁設(shè)計(jì)添加更多的美感和可讀性。