html ol 序号不出来,html中ol标签不显示序号的解决办法
html ol 和 ul 區別之一就是 ol 標簽下面的 li 標簽會自動帶上序號,而是 ul 下面的 li 標簽不會。如果 ol li 標簽沒有序號,原因很簡單, 就是你重置了 ol 標簽的左內邊距,即 padding-left。要使用 ol li 標簽正常顯示序號,必須保證 ol 標簽有 20px 左右的左內邊距,即 padding-left: 20px;瀏覽器默認是會顯示ol li 標簽的序號的,但為什么我們寫出來的網頁卻不能顯示序號呢?
那是因為你對瀏覽器默認樣式進行了重置。大多數情況下我們會使用以下CSS代碼來重置瀏覽器默認樣式
*{margin:0;padding:0;}
這樣一樣,ol 標簽的左內邊距就被重置為0. 導致序號消失。
要解決這個問題有兩個方法:
方法一.??對 ol 標簽設置 20px 以上的左內邊距,即
ol{padding-left: 20px;}
方法二. 對 ol 下面的 li 標簽設置以下樣式
ol li{
list-style-type:decimal;
list-style-position:inside;
}
方法二在IE 6/7 中會導致所有 li 的序號全部變成1. 如果要考慮IE 6/7,請使用方法一。
如果想要禁用 ol li 標簽的序號,只要對 ol 標簽設置以下樣式并且不要對 ol li 設置如上方法二中的樣式即可。
ol{
list-style:none;
}
(資源庫 www.zyku.net)
總結
以上是生活随笔為你收集整理的html ol 序号不出来,html中ol标签不显示序号的解决办法的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Tarena 课程体系
- 下一篇: 深度分享:解读中国老年行业创新创业生态,