CSS設定文字折行處理

2021-07-30 11:46:57 字數 624 閱讀 2842

一般情況

只要定好文字所在容器的寬度文字就會折行,如下面:

想控制一段文字不折行,設定如下的樣式:

white-space: nowrap;

word-wrap: normal;

word-break: keep-all;

相反,如果一段文字不能折行了,那麼可能是設定了如上的樣式,則將樣式改為

white-space: normal;

word-wrap: break-word;

word-break:break-all;

含有很長英文情況

定好文字所在容器的寬度後文字不會折行,效果:

對其設定

white-space: normal;

word-wrap: break-word;

word-break:break-all;

可以實現折行。如下:

css 文字折行

word wrap break word overflow hidden 而不是word wrap break word word break break all 也不是word wrap break word overflow auto 這種最好的方式,在 ie 下沒有任何問題,在 ff 下,長串...

CSS文字如何折行介紹

white space 屬性設定程式設計客棧如何處理元素內的空白 空格 換行和tab字元 的處理。normal 預設。空白會被瀏覽器忽略。pre 空白會被瀏覽器保留。其行為方式類似 html 中的 標籤。nowrap 文字不會換行,文字會在在同一行上繼續,直到遇到 程式設計客棧lt br 標籤為止。...

css 文字設定

文字修飾 text decoration underline下劃線 none沒有修飾,over line上劃線 line through中劃線 vertical align 豎直對齊方式 text align center 水平居中 vertical align 豎直對齊方式 text align ...