CSS樣式是網頁設計中不可或缺的一部分。其中，自動換行是一種非常重要的樣式效果。它使得文字在到達容器邊緣時能夠自動換行、繼續顯示，不會超出容器范圍。下面我們來介紹如何在CSS中實現自動換行。

p {
/* 設置容器寬度 */
width: 400px;
/* 設置自動換行 */
word-wrap: break-word;
}

以上代碼中，我們使用了word-wrap屬性來實現自動換行。word-wrap是CSS3中引入的一個新屬性，它用來指定文本是否允許被換行，并控制換行的方式。break-word是word-wrap屬性的一個可選值，它表示單詞超出容器寬度時，將會被強制換行。另外，我們還需要設置容器的寬度，以便瀏覽器知道何時需要做出換行處理。

除了word-wrap屬性之外，我們還可以使用white-space屬性來實現自動換行。white-space也是CSS中的一個屬性，它用來控制空格和換行的顯示方式。其中，nowrap表示不允許換行，而normal表示自動換行。我們可以將white-space設置為normal來實現自動換行效果。

p {
/* 設置容器寬度 */
width: 400px;
/* 設置自動換行 */
white-space: normal;
}

使用CSS實現自動換行非常簡單，只需要在樣式中添加一些相關屬性即可。需要注意的是，不同瀏覽器對自動換行的實現方式可能略有不同。如果需要兼容多個瀏覽器，我們可以在代碼中加入一些瀏覽器前綴來實現兼容。例如：

/* 兼容所有瀏覽器 */
p {
/* 設置容器寬度 */
width: 400px;
/* 設置自動換行 */
word-wrap: break-word;
-webkit-word-wrap: break-word;
-moz-word-wrap: break-word;
-ms-word-wrap: break-word;
-o-word-wrap: break-word;
}

在以上代碼中，我們加入了webkit、moz、ms和o等前綴，以便兼容各個瀏覽器。這樣，即使瀏覽器不支持word-wrap屬性，我們的頁面也能夠正常顯示自動換行效果。