CSS中的換行屬性(word-wrap
和white-space
)可以影響文本的呈現方式。比如說對于長句或長單詞,如果不設置換行屬性,它們會超出文本框,造成不必要的滾動條和顯示問題。
/* 設置元素中的文本可以換行 */
word-wrap: break-word;
/* 控制空白符的處理方式 */
white-space: nowrap; /* 不折行,超出容器范圍顯示的部分會被剪裁 */
white-space: normal; /* 折行,超出容器范圍的文本會被換行 */
white-space: pre; /* 保留空格和換行,遇到空格或換行符會換行 */
white-space: pre-line; /* 壓縮空白符序列,遇到空格和換行符換行 */
white-space: pre-wrap; /* 保留空格,遇到換行符會換行 */
特別是在移動設備上,更應該關注文本的換行呈現。因為移動設備的屏幕尺寸比較小,一段過長的文本看起來不僅不美觀,而且不易閱讀。因此,CSS中的換行屬性可以通過優雅且簡單的方式解決這個問題。
上一篇php 將字符串轉為文字
下一篇java里面整除和取余