CSS換行和不換行
強制不換行
div{
white-space:nowrap;
}
自動換行
div{
word-wrap: break-word;
word-break: normal;
}
強制英文單詞斷行
div{
word-break:break-all;
}
超出顯示省略號
p{text-overflow:ellipsis;overflow:hidden;}
white-space: normal|pre|nowrap|pre-wrap|pre-line|inherit;
white-space 屬性設定如何處理元素內的空白
normal 預設。空白會被瀏覽器忽略。
pre 空白會被瀏覽器保留。其行為方式類似 HTML 中的 pre 標籤。
nowrap 文字不會換行,文字會在在同一行上繼續,直到遇到 br 標籤為止。
pre-wrap 保留空白符序列,但是正常地進行換行。
pre-line 合併空白符序列,但是保留換行符。
inherit 規定應該從父元素繼承 white-space 屬性的值。
word-wrap: normal|break-word;
word-wrap 屬性用來標明是否允許瀏覽器在單詞內進行斷句,這是為了防止當一個字串太長而找不到它的自然斷句點時產生溢位現象。
normal: 只在允許的斷字點換行(瀏覽器保持預設處理)
break-word:在長單詞或URL地址內部進行換行
word-break: normal|break-all|keep-all;
word-break 屬性用來標明怎麼樣進行單詞內的斷句。
normal:使用瀏覽器預設的換行規則。
break-all:允許再單詞內換行
keep-all:只能在半形空格或連字元處換行
相關文章
- css自動換行與不換行CSS
- css實現強制不換行/自動換行/強制換行CSS
- css中實現強制不換行/自動換行/強制換行CSS
- css html span塊狀不換行CSSHTML
- CSS 文字換行CSS
- 【轉】css樣式自動換行(強制換行)CSS
- css控制強制換行CSS
- css li元素中的文字超出隱藏不換行效果CSS
- Python 輸出不換行Python
- GridVIew標題不換行View
- 微信小程式text元件和view元件不換行微信小程式元件View
- 回車和換行
- 網頁中的CSS換行控制網頁CSS
- CSS 塊級元素和行內元素和行內塊元素 及其相互轉換CSS
- CSS將長文字換行的方法(轉)CSS
- CSS實現的換行效果程式碼CSS
- CSS文字超出寬度---換行總結CSS
- HTML換行符和水平線HTML
- excel換行Excel
- css中經遇到的文字換行問題CSS
- 實現強制換行的CSS程式碼CSS
- 不同瀏覽器下word-wrap,word-break,white-space強制換行和不換行總結瀏覽器
- GridView強制換行與自動換行View
- Linux 轉換換行符Linux
- **PHP中替換換行符PHP
- CSS控制所有瀏覽器水平居中和控制連結不換行的效果CSS瀏覽器
- 【LaTeX入門】05、換行、換段、換頁、首行縮排等命令
- CSS設定超出指定寬度自動換行CSS
- JavaScript 字串換行JavaScript字串
- PHP textarea換行PHP
- shell指令碼不換行重新整理資料指令碼
- 【換行符】Windows、Unix、Mac不同作業系統的回車符 和換行符 WindowsMac作業系統
- js將文字框的內容回車換行符轉換為<br/>換行JS
- 行列轉換,列行轉換統計
- CSS 之 div中文字超出時自動換行CSS
- js保留文字的空格和換行效果JS
- windows批處理之六-echo輸出不換行Windows
- 換行符處理