通常我們在編寫html頁面的時候，我們一般都會在<td>或者<div>裡面通過設定樣式來控制 table 或者 div 的寬度
例如:
<table width="603" cellspacing="0" cellpadding="0">
<tr>
<td style="width:200px;">哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</td>
<td style="width:200px;">1231231231</td>
<td style="width:200px;">123123123</td>
</tr>
</table>
效果:
但是如果有惡意輸入呢？
<td style="width:200px;">111111111111111111111111111111111111111111111111111111111111</td>
效果：
這樣我們的設定的width就無效了，原因是因為：浏覽器在解析我們頁面的時候，給這一串1當成一個單詞了，這樣就不會自動切斷字元串而進行換行。
解決方案：
<td style="width:200px;word-wrap:break-word;word-break:break-all">111111111111111111111111111111111111111111111111111111111111</td>
效果：
word-wrap:break-word; 和 word-break:break-all 的差別
1，word-break:break-all 例如div寬200px，它的内容就會到200px自動換行，如果該行末端有個英文單詞很長（congratulation等），它會把單詞截斷，變成該行末端為conra(congratulation的前端部分)，下一行為tulation（conguatulation）的後端部分了。
2，word-wrap:break-word 例子與上面一樣，但差別就是它會把congratulation整個單詞看成一個整體，如果該行末端寬度不夠顯示整個單詞，它會自動把整個單詞放到下一行，而不會把單詞截斷掉的。
word-break;break-all 支援版本：IE5以上 該行為與亞洲語言的 normal 相同。也允許非亞洲語言文本行的任意字内斷開。該值适合包含一些非亞洲文本的亞洲文本。
WORD-WRAP:break-word 支援版本：IE5.5以上 内容将在邊界内換行。如果需要，詞内換行( word-break )也将發生。