浅谈list-style

最新推荐文章于 2024-06-17 23:43:30 发布

原创最新推荐文章于 2024-06-17 23:43:30 发布 · 791 阅读

0 ·

CC 4.0 BY-SA版权

本文探讨了CSS中list-style属性的不同表现形式，特别是在IE6和IE7浏览器中的特性。重点介绍了list-style:none;与list-style:none outside none;的区别，并解释了在特定条件下列表标记的位置变化。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

浅谈 list-style

我们经常看到网站的有些网站的global.css里有项 ul, ol, li {list-style:none outside none;} 的设置，为啥不是设成 {list-style: none; } 呢？

原因是：
在IE6,7中,与list-style:none的表现一模一样.在IE6,7中当UL具有float和display:inline属性后,设置了list-style:none,则list-style-position也默认为inside了，即列表符被隐藏,但是仍然留有位置(list-style-position:inside);当UL不具有float和display:inline;时，无论有没有list-style:none这个属性,列表符都被隐藏,不占位置。

附：list-style-position 属性。

list-style-position: inside 相当于把列表项标志是列表内容一样，位居最前面。

list-style-position: outside 相当于把列表项标志放在列表内容的边框的外面的一定位置。

如下图效果：