为什么list-style-type不起作用？没有显示任何内容

Question

CSS和HTML代码如下所示。我使用了eric meyer的重置脚本..我编辑了我认为相关的那个。

/* reset CSS script */ 

ol, ul { 
    list-style: none; 
} 

/* End of reset CSS script */ 

#navbar { 
    border: 5px solid red; 
    margin: -580px 0 0 160px; 
    width: 1500px; 

    font-size: 26px; 
    font-family: 'Conv_LITHOSPRO-REGULAR'; 
} 
#navbar ul li {  
     display:inline; 
     padding:0 35px 0 0; 
     list-style-type:disc; 
     } 

这是HTML代码。

 <nav id="navbar"> 
      <ul id="hli"> 
       <li id="OP"><a href="Orders.html">Your Order</a></li> 
       <li id="MP"><a href="Menu.html">Menu</a></li> 
       <li id="CUP"><a href="ContactUs.html">Contact Us</a></li> 
       <li id="JP"><a href="Jobs.html" target="_blank">Jobs</a></li> 
       <li id="TCP"><a href="TC.html">Terms & Conditions</a></li> 
      </ul> 
     </nav> 

Answer 1

的list-style-type property适用于只有display: list-item元素。因此，如果您希望在已转向内联元素的列表项之前放置某些标记，则必须直接或通过生成的内容将标记添加到内容中。例如，下面在每个项目前加一个子弹“•”和一个空格：

#navbar ul li:before { 
    content: "\2022 " 
}