DIV的內容自動換行

2021-06-17 17:40:39 字數 1378 閱讀 6899

word-break:break-all和word-wrap:break-word都是能使其容器如div的內容自動換行

它們的區別就在於:

1,word-break:break-all 例如div寬200px,它的內容就會到200px自動換行,如果該行末端有個英文單

詞很長(congratulation等),它會把單詞截斷,變成該行末端為conra(congratulation的前端部分),

下一行為tulation(conguatulation)的後端部分了。

2,word-wrap:break-word 例子與上面一樣,但區別就是它會把congratulation整個單詞看成乙個整體,

如果該行末端寬度不夠顯示整個單詞,它會自動把整個單詞放到下一行,而不會把單詞截斷掉的。

3,word-break;break-all 支援版本:ie5以上 該行為與亞洲語言的 normal 相同。也允許非亞洲語言文

本行的任意字內斷開。該值適合包含一些非亞洲文字的亞洲文字。 word-wrap:break-word 支援版本:

ie5.5以上 內容將在邊界內換行。如果需要,詞內換行( word-break )也將發生。**自動換行,避免撐

開。 word-break : normal | break-all | keep-all 引數: normal :  依照亞洲語言和非亞洲語言的

文字規則,允許在字內換行 break-all :  該行為與亞洲語言的normal相同。也允許非亞洲語言文字行

的任意字內斷開。該值適合包含一些非亞洲文字的亞洲文字 keep-all :  與所有非亞洲語言的normal相

同。對於中文,韓文,日文,不允許字斷開。適合包含少量亞洲文字的非亞洲文字 語法: word-wrap : 

normal | break-word 引數: normal :  允許內容頂開指定的容器邊界 break-word :  內容將在邊界

內換行。如果需要,詞內換行(word-break)也行發生說明:設定或檢索當當前行超過指定容器的邊界時

是否斷開轉行。

對應的指令碼特性為wordwrap。請參閱我編寫的其他書目。 語法: table-layout : auto | fixed 引數: 

auto :  預設的自動演算法。布局將基於各單元格的內容。**在每一單元格讀取計算之後才會顯示出來

。速度很慢 fixed :  固定布局的演算法。在這演算法中,水平布局是僅僅基於**的寬度,**邊框的寬

度,單元格間距,列的寬度,而和**內容無關說明:設定或檢索**的布局演算法。對應的指令碼特性為

tablelayout。

不支援 word-break屬性可以用white-space:normal;來代替,這樣在firefox和ie下就都能正確換行,而

且要注意,單詞間的空格不能用來代替,不然不能正確換行。

DIV的內容自動換行

word break break all和word wrap break word都是能使其容器如div的內容自動換行 它們的區別就在於 1,word break break all 例如div寬200px,它的內容就會到200px自動換行,如果該行末端有個英文單 詞很長 congratulatio...

DIV的內容自動換行

word break break all和word wrap break word都是能使其容器如div的內容自動換行。它們的區別就在於 1,word break break all 例如div寬200px,它的內容就會到200px自動換行,如果該行末端有個英文單詞很長 congratulation...

div自動換行

它們的區別就在於 1,word break break all 例如div寬200px,它的內容就會到200px自動換行,如果該行末端有個英文單詞很長 congratulation等 它會把單詞截斷,變成該行末端為conra congratulation的前端部分 下一行為tulation cong...