爲什麼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 " 
}