去除li小圓點以及解決其空格問題


  不管是ul還是ol中的li前面始終有個小圓點,以前沒有發現問題,都是直接給ul增加list-style:none;屬性,可今天屢試不爽的屬性出現問題了,上圖

通過兩張截圖可以清晰的看到雖然小圓點去掉了,但是還是占着位置。典型的占着**不**,而且還影響視圖效果,怎么辦?先看看樣式,里面沒有margin或者padding這類的東東,然后看看盒模型,果然:

從盒模型可以看到ul有個padding,外圍有margin,那就把padding去掉試試。

結果顯示終於正常了,也沒有占位了,完美!!

總結:修改屬性可能還達不到自己想要的效果,可以多查看CSS樣式以及盒模型,很有用的!

--------------------------------------------------

附上其他list-style-type的取值

  disc   默認值。實心圓
  circle   空心圓
  square   實心方塊
  decimal   阿拉伯數字 
   lower-roman   小寫羅馬數字
  upper-roman   大寫羅馬數字
  lower-alpha   小寫英文字母
  upper-alpha   大寫英文字母
  none   不使用項目符號

當然也可以自定義項目符號list-style-type:url();


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM