在CSS中,文字自動換行也是一個很重要的樣式,尤其是在移動端Web開發(fā)中,文字自動換行能夠讓一些閱讀體驗(yàn)更好的網(wǎng)頁變得更為友好,那么如何實(shí)現(xiàn)CSS樣式文字自動換行呢?
/* 通過 word - wrap 實(shí)現(xiàn)文字自動換行 */ p { word - wrap: break - word; }
上述代碼可以讓文字在單詞和連字符處換行,而不會斷開單詞。如果想要文字盡量不被截?cái)啵梢允褂孟旅娴拇a:
/* 通過 word - break 實(shí)現(xiàn)文字自動換行 */ p { word - break: break - all; }
值得注意的是,如果在某些較老的瀏覽器中,CSS樣式文字自動換行的效果會出現(xiàn)一些問題,這時需要添加一些額外的CSS樣式來解決,如下面的代碼:
/* 兼容某些老式瀏覽器 */ word - break: normal; /* 兼容IE */ white - space: pre - wrap; /* 兼容W3C */
在實(shí)際使用過程中,可以根據(jù)自己的需求選擇不同的 CSS 樣式文字自動換行的方式,以達(dá)到最佳的閱讀體驗(yàn)。
上一篇css樣式怎么添加圖片
下一篇css樣式文字前面