如下圖所示，當一個定義了寬度的DIV或者其他元素中填充的全部為純英文或者純數字的時候，在IE和火狐中都會被撐大，而不會自動換行
?
并且當數字或者英文中帶有漢字時，會從漢字處換行，而純漢字卻可以自動換行。這個問題如何解決？先來認識一下兩位主角word-wrap和word-break
兩種取值：
(1)normal
(2)break-word（此值用來強制換行，內容將在邊界內換行，中文沒有任何問題，英文語句也沒問題。但是對于長串的英文，就不起作用。）
?
word-break
用來控制斷詞
三種取值：
(1)normal
(2)break-all（是斷開單詞。在單詞到邊界時，下個字母自動到下一行。主要解決了長串英文的問題。）
(3)keep-all（是指Chinese, Japanese, and Korean不斷詞，一句話一行，可以用來排列古詩喲~）
【解決方法】
可以在CSS中加入：
word-break:break-all;
由于項目的需要，其中一個屬性的值不能超過50個字符限制，在測試的時候發現table中只能顯示大概20多個字符，其余的都被遮蓋掉了，故搜尋了一下解決方案，以備下次再用。
我的測試程序如下：
<html>
<head>
<title>
測試英文和數字表格換行
</title>
</head>
<body>
<table style="table-layout:fixed;word-break:break-all" width="100%" border="0" cellspacing="0" cellpadding="5" >
<tr>
<th>值</th>
<th>含義</th>
<th>更新時間</th>
<th>操作人</th>
<th>操作</th>
</tr>
<tr>
<td>測試</td>
<td>ABCDGFHGJYABCDGFHGJYABCDGFHGJYABCDGFHGJYABCDGFHGJY</td>
<td>2009-09-18 15:43:24</td>
<td>某人</td>
<td>換行<td>
</tr>
</table>
</body>
</html>
?
這里說明一下其中style屬性中的語法：
Html代碼
table-layout :auto | fixed
參數：
Html代碼
auto ： 缺省設置. 列寬將設置為不可分割的最大的內容的寬度。
fixed ： 表的寬度和列的寬度固定，不隨單元格中內容而改變
1、設置了各個列的寬，沒有設表的寬：表的寬度等于各個列的寬度和
2、設置了表的寬度，沒有設各個列的寬度：各個列的寬度平均分配
3、要是都沒設置寬度：表的寬度為100％，各個列的寬度平均分配
Html代碼
word-break : normal | break-all | keep-all
參數：
Html代碼
normal : 依照亞洲語言和非亞洲語言的文本規則，允許在字內換行
break-all : 該行為與亞洲語言的normal相同。也允許非亞洲語言文本行的任 意字內斷開。該值適合包含一些非亞洲文本的亞洲文本
keep-all : 與所有非亞洲語言的normal相同。對于中文，韓文，日文，不允許字斷開。適合包含少量亞洲文本的非亞洲文本
注意：該語法僅適用于IE內核，對火狐不兼容！
?
更多文章、技術交流、商務合作、聯系博主
微信掃碼或搜索：z360901061
微信掃一掃加我為好友
QQ號聯系： 360901061
您的支持是博主寫作最大的動力，如果您喜歡我的文章，感覺我的文章對您有幫助，請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧，狠狠點擊下面給點支持吧，站長非常感激您！手機微信長按不能支付解決辦法：請將微信支付二維碼保存到相冊，切換到微信，然后點擊微信右上角掃一掃功能，選擇支付二維碼完成支付。
【本文對您有幫助就好】元
