CSS解決內容換行問題

2021-05-23 16:47:14 字數 688 閱讀 5301

語法:

white-space : normal | pre | nowrap

引數:normal :  預設處理方式

pre :  用等寬字型顯示預先格式化的文字。不合併字間的空白距離和進行兩端對齊。

nowrap :  強制在同一行內顯示所有文字,直到文字結束或者遭遇br物件。

說明:設定或檢索物件內空格的處理方式。

語法:word-wrap : normal | break-word

引數:normal :  允許內容頂開指定的容器邊界

break-word :  內容將在邊界內換行。如果需要,詞內換行(word-break)也行發生

說明:設定或檢索當當前行超過指定容器的邊界時是否斷開轉行。

語法:word-break : normal | break-all | keep-all

引數:normal :  依照亞洲語言和非亞洲語言的文字規則,允許在字內換行

break-all :  該行為與亞洲語言的normal相同。也允許非亞洲語言文字行的任意字內斷開。該值適合包含一些非亞洲文字的亞洲文字

keep-all :  與所有非亞洲語言的normal相同。對於中文,韓文,日文,不允許字斷開。適合包含少量亞洲文字的非亞洲文字

說明:設定或檢索物件內文字的字內換行行為。尤其在出現多種語言時。

對於中文,應該使用break-all 。

CSS解決英文自動換行問題

當容器內出現長串英文時,容器會被撐大,此時內容不會自動換行,那麼如何用css來解決英文自動換行問題呢?請往下閱讀 如果是在table內出現此問題,可以在table標籤中加入 style word wrap break word table layout fixed word break break ...

CSS控制文字內容換行

在div中,文字布局經常出現,換行混亂的情況。我們經常遇到的問題表現為 1.如果是全英文本串,中間不包含任何符號 包括空格 不自動換行 2.中英文混寫,則在英文本串的開始處換行 英文長度 div長度 結尾處不換行 3.英文整個單詞換行。等等,可能還有一些問題,這裡只列出了常見的幾個。上面幾個css屬...

css 文字換行問題

文字 或者 nwhite space normal 預設。空白會被瀏覽器忽略。pre 空白會被瀏覽器保留。其行為方式類似 html 中的標籤。nowrap 文字不會換行,文字會在在同一行上繼續,直到遇到 標籤為止。pre wrap 保留空白符序列,但是正常地進行換行。pre line 合併空白符序列...