DIV+CSS布局文字較多時候重疊下一行文字內容如何解決？

CSS+DIV布局ul li列表文字內容，當文字比較多時，上排文字重疊在下排li標簽內文字上這是什么原因？如何解決css文字重疊呢？

內容較多時候重疊下一行內容效果現象截圖

出現原因是因為對li設置了css高度，和css寬度,當內容比較多是內容會自動換行，而又有高度，這樣就造成內容溢出而與下一排內容重疊覆蓋現象。

解決方法如下：

第一種，取消高度樣式設置

我們取消css height的樣式，即可實現不重疊，但內容會換行占位。

去掉css height高度限制后解決文字重疊截圖

第二種，使用隱藏溢出樣式單詞overflow:hidden

此方法是使用overflow隱藏超出對象設置寬度高度的內容，推薦使用。

使用css overflow隱藏超出溢出內容

最終案例代碼如下：

內容重疊解決 css5.com.cn

ul,li{ list-style:none}

ul{ width:100px}

ul li{ float:left;width:100px; height:22px;line-height:22px;

text-align:left; overflow:hidden}

/* css注釋：為了便于截圖，將CSS代碼換行排版 */

• 標題一內容
• 測試文字多重疊標題二內容
• 標題三內容

作者：css5

總結

以上是生活随笔為你收集整理的css 文字重叠_html网页文字重叠 字体叠加显示css如何解决的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。