英文與中文的換行問題

日期：2013-12-13  來源：攀枝花惠康網絡公司

參數：
設置或檢索當當前行跨越指定容器的鴻溝時是否斷開轉行。

巨匠都知道英文是在一個詞內不許可斷字換行的，如不美觀有些BT的長度單詞呈現就會將表格或者層撐爆，尤其是加上BT的測試人員，更會讓你難看，何等完美的頁面咋就這樣了。

　　具體斗勁：

view plaincopy to clipboardprint?

1. <div style=“width:200px;”>此容此容此容此容此容此此容此容此容此容此容此容此容此容此容此容</div>
2. <div style=“width:200px;”>fffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</div>
3. <div style=“width:200px; overflow:hidden”>fffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</div>
4. <div style=“width:200px; overflow:scroll;”>fffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</div>
5. <div style=“width:200px; word-break: break-all”>fffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</div>
6. <div style=“width:200px; word-wrap: break-word;”>fffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</div>
7. <div style=“width:200px; word-wrap: break-word; word-break: break-all”>fffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</div>
8. <table cellspacing=“0″ cellpadding=“0″ style=“table-layout:fixed; width:202px; word-break:break-all;”>
9. <tr>
10. <td>fffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</td>
11. </tr>
12. <tr>
13. <td>fffffffffffffffffffffffffffffffffffffffffffffffffffffffffffff</td>
14. </tr>
15. </table>

參數：

　　相關CSS語法

語法：
word-break : normal; break-all; keep-all

參數：
normal : 　遵照亞洲說話和非亞洲說話的文本軌則，許可在字內換行
break-all : 　該行為與亞洲說話的normal不異。也許可非亞洲說話文本行的肆意字內斷開。該值適合包含一些非亞洲文本的亞洲文本
keep-all : 　與所有非亞洲說話的normal不異。對于中文，韓文，日文，不許可字斷開。適合包含少量亞洲文本的非亞洲文本

語法：
word-wrap : normal; break-word

normal : 　許可內容敞開指定的容器鴻溝
break-word : 　內容將在鴻溝內換行。如不美觀需要，詞內換行（word-break）也行發生

聲名：

語法：
auto : 　默認的自動算法。結構將基于各單元格的內容。表格在每一單元格篡奪計較之后才會顯示出來。速度很慢
table-layout : auto; fixed

fixed : 　固定結構的算法。在這算法中，水平結構是僅僅基于表格的寬度，表格邊框的寬度，單元格間距，列的寬度，而和表格內容無關

聲名：
設置或檢索表格的結構算法。