为什么显示时列表样式会消失:块被添加到列表中的列表项(<ul>或<ol>)？

Question

这似乎是有效的display: inline;和display: inline-block;太.

这就是我的意思:

ul li {
  display: block;
  /* Or display: inline; */
  /* Or display: inline-block; */
}

<ul>
  <li>list item1</li>
  <li>list item3</li>
  <li>list item3</li>
</ul>

列表样式我指的是实际的"子弹"或"数字"(何时<ol>使用)

Answer 1

那是因为通常,display设置list-item为<li>元素.请参阅W3C CSS3规范:http://www.w3.org/TR/css3-lists/#declaring-a-list-item.

要声明列表项,'display'属性应设置为'list-item'.

请注意,您可以为任意HTML元素提供相同的行为; 设置display: list-item在<div>例如.

Answer 2

更新的解决方案是使用:before和content.

有关工作示例,请参阅此JSfiddle.http://jsfiddle.net/t72h3/

ul li {
  display: inline-block;
}

ul li:before {
  content: "• ";
}

<ul>
  <li>list item1</li>
  <li>list item3</li>
  <li>list item3</li>
</ul>