css控制文字自動換行

《css控制文字自動換行》由會員上傳分享，免費在線閱讀，更多相關內容在行業(yè)資料-天天文庫。

1、自動換行問題,正常字符的換行是比較合理的,而連續(xù)的數字和英文字符常常將容器撐大,挺讓人頭疼,下面介紹的是CSS如何實現(xiàn)換行的方法對于div,p等塊級元素正常文字的換行(亞洲文字和非亞洲文字)元素擁有默認的white-space:normal,當定義的寬度之后自動換行html正常文字的換行(亞洲文字和非亞洲文字)元素擁有默認的white-space:normal,當定義css#wrap{white-space:normal;width:200px;}1.（IE瀏覽器）連續(xù)的英文字符和阿拉伯數字,使用word-wrap:break-word;或者word-bre

2、ak:break-all;實現(xiàn)強制斷行#wrap{word-break:break-all;width:200px;}或者#wrap{word-wrap:break-word;width:200px;}abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111效果：可以實現(xiàn)換行2.（Firefox瀏覽器）連續(xù)的英文字符和阿拉伯數字的斷行,Firefox的所有版本的沒有解決這個問題,我們只有讓超出邊界的字符隱藏或者,給容器添加滾動條#wrap{word-break:break-all;width:200px;over

3、flow:auto;}abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111效果：容器正常，內容隱藏對于table1.(IE瀏覽器)使用table-layout:fixed;強制table的寬度,多余內容隱藏abcdefghigklmnopqrstuvwxyz1234567890ssssssssssssss效果：隱藏多余內容2.(IE瀏覽器)使用table-layout:f

4、ixed;強制table的寬度,內層td,th采用word-break:break-all;或者word-wrap:break-word;換行abcdefghigklmnopqrstuvwxyz1234567890abcdefghigklmnopqrstuvwxyz1234567890

5、r>效果：可以換行3.(IE瀏覽器)在td,th中嵌套div,p等采用上面提到的div,p的換行方法4.(Firefox瀏覽器)使用table-layout:fixed;強制table的寬度,內層td,th采用word-break:break-all;或者word-wrap:break-word;換行，使用overflow:hidden;隱藏超出內容，這里overflow:auto;無法起作用

6、eak:break-all;overflow:hidden;">abcdefghigklmnopqrstuvwxyz1234567890abcdefghigklmnopqrstuvwxyz1234567890效果：隱藏多于內容5.(Firefox瀏覽器)在td,th中嵌套div,p等采用上面提到的對付Firefox的方法運行代碼框最后，這種現(xiàn)象出現(xiàn)的幾率很小，但是不能排除網友的惡搞。如果有什么問

7、題請到在下面留言下面是提到的例子的效果

8、/css">table,td,th,div{bord