css 文本換行，文本空白符處理相關
阿新 • • 發佈：2017-06-01
article 空白 註意 explorer ecs mes spa browser 技術 
.message .text { display: block; border-radius:10px; width: 223px; height: auto; padding: 11px 20px 19px 17px; font-size:14px; color:#4a4a4a; float: left; resize: none; word-break: break-all;/*自動換行*/ word-wrap: break-word;/*以單詞換行*/ white-space: pre-wrap; }
屬性定義及使用說明
white-space屬性指定元素內的空白怎樣處理。
| 屬性 | |||||
|---|---|---|---|---|---|
| white-space | 1.0 | 5.5 | 3.5 | 3.0 | 9.5 |
屬性值
| 值 | 描述 |
|---|---|
| normal | 默認。空白會被瀏覽器忽略。 |
| pre | 空白會被瀏覽器保留。其行為方式類似 HTML 中的 <pre> 標簽。 |
| nowrap | 文本不會換行，文本會在在同一行上繼續，直到遇到 <br> 標簽為止。 |
| pre-wrap | 保留空白符序列，但是正常地進行換行。 |
| pre-line | 合並空白符序列，但是保留換行符。 |
| inherit | 規定應該從父元素繼承 white-space 屬性的值。 |
屬性定義及使用說明
word-break屬性指定非CJK腳本的斷行規則。
提示:CJK腳本是中國，日本和韓國（"中日韓"）腳本
語法
word-break: normal|break-all|keep-all;| 值 | 描述 |
|---|---|
| normal | 使用瀏覽器默認的換行規則。 |
| break-all | 允許在單詞內換行。 |
| keep-all | 只能在半角空格或連字符處換行。 |
屬性定義及使用說明
word-spacing屬性增加或減少字與字之間的空白。
註意： 負值是允許的。
| 默認值： | normal |
|---|---|
| 繼承： | yes |
| 版本： | CSS1 |
| JavaScript 語法： | object.style.wordSpacing="10px" |
屬性值
| 值 | 描述 |
|---|---|
| normal | 默認。定義單詞間的標準空間。 |
| length | 定義單詞間的固定空間。 |
| inherit | 規定應該從父元素繼承 word-spacing 屬性的值。 |
css 文本換行，文本空白符處理相關