CSS的屬性中有一個非常重要的屬性：斷行的每行寬度

p{
width: 300px;  //整個段落的寬度
word-wrap: break-word;  //允許單詞被斷開
word-break: break-all;  //強制斷開單詞
}

當我們在文本框中輸入很長的內容時，常常會遇到一種情況：一整行的文字會超出文本框的邊界，這樣的現象非常影響美觀。所以，我們需要一個方法來解決這個問題，而這個方法便是：斷行的每行寬度。

所謂“斷行的每行寬度”，就是指在文本框或者容器中分行顯示文本時，每行的寬度。比如，我們將一個段落的寬度設置為300px，而一整行的文字卻有600px，這時我們需要將一整行的文字斷成兩行來顯示，每行的寬度為300px。這樣，我們就可以將一個較長的文本分成幾行，讓頁面更加美觀。

p{
width: 300px;  //整個段落的寬度
word-wrap: break-word;  //允許單詞被斷開
word-break: break-all;  //強制斷開單詞
}

上面的代碼解釋：

首先，我們將整個段落的寬度設置為300px。這個寬度可以根據具體情況進行調整，只要保證顯示的效果最佳即可。

接著，我們添加了兩個新的屬性：word-wrap和word-break。

word-wrap屬性可以讓文本在必要時進行斷行，避免文字超出邊界。設置為break-word時，可以使單詞被斷開，從而更自然地分行。

word-break屬性可以強制斷開單詞，從而更加自然地分行。在上面的代碼中，我們將其設置為break-all，代表任何字符在文本中都可以斷開。

斷行的每行寬度是非常重要的，它可以讓文本顯示更加美觀。在實際開發中，我們應該根據具體情況進行調整，在保證文本美觀的前提下，讓頁面更加優秀。