OL有序列表 IE 与非IE 浏览器兼容问题解决

最新推荐文章于 2021-06-15 14:51:24 发布

原创最新推荐文章于 2021-06-15 14:51:24 发布 · 197 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#IE #浏览器 #HTML

Css 专栏收录该内容

8 篇文章

订阅专栏

本文介绍了一种使用CSS实现有序列表的特殊样式的方法，通过设置list-style:decimalinside和display:list-item，使数字编号在列表项内显示，并确保了在不同浏览器间的兼容性。

关键是
[quote]让数字在内部显示
list-style:decimal inside;
如果不加，IE不会递增
display: list-item;[/quote]


<style>
.iknow_list{ width:241px; height:160px; padding:0px; margin-top:5px; background:url(img/fk.jpg) no-repeat right bottom}
.iknow_list ol{ margin:0px; padding:0px; width:241px;}
.iknow_list ol li{ margin:0px; padding:0px;list-style:decimal inside;display: list-item; height:24px; line-height:24px;}
</style>
<div class="iknow_list">
<ol start="1" type="1"> 
    <li>第一名</li> 
    <li>第二名</li> 
    <li>第三名</li> 
    <li>第四名</li> 
    <li>第五名</li> 
    <li>第六名</li> 
    <li>第七名</li> 
</ol> 
</div>