Question

我面对的一件非常令人困惑的事情。

的CSS

ul {
    list-style: none;
    padding: 1em 0;
    margin: 0;
}
li {
    padding: 1em;
    display: inline;
}
li a {
    text-decoration: none;
}
.normalized-list{
    list-style-type: disc;
    list-style-image: none;
    list-style-position: inside;
    padding: 1em 1em;

}
.normalized-list li{
    display: block;
    padding: 0.5em;
}

HTML

<ul class="normalized-list">
<li>...</li>
</ul>

可悲的是，李元素上没有出现子弹。其实我不知道为什么。

Answer 1

display: list-item;

不是block。

Answer 2

可能是因为你在里面而不是在元素之外显示它。所以它不可见。

.normalized-list{
list-style-type: disc;
list-style-image: none;
list-style-position: outside;
}

你在多个浏览器中测试过吗？请尝试firefox与firebug扩展，以查看继承是否正常工作

Answer 3

嗯，有些浏览器在谈到这一点时非常有趣我想尝试的是以下

ul
{
  /*set your normal unordered list stuff*/
}

ul#specializedlist
{
  /*set your specialized list stuff*/
}

Answer 4

但它正在开发IE8。 Firefox 3.6没有显示子弹。你的期望是什么？

列表类型样式

4 个答案: