HTML/CSS列表樣式幫助：S

Question

我做了一個列表，並使用ul標籤添加了一個id，但唯一的辦法是我可以讓我的列表被樣式化爲實際樣式的ul和li標籤，但是如果我這樣做我所有的清單看起來都一樣。如果你不明白繼承人的代碼 -

<ul id="navigation"> 
       <li><a href="http://www.google.com">Home</a></li> 
       <li>Premium</li> 
       <li>FAQ</li> 
       <li>Disclaimer</li> 
      </ul> 
      <ul id="login"> 
       <li>Login</li> 
       <li>-</li> 
       <li>Register</li> 
      </ul> 

但我不希望這兩個名單將樣式這樣，我想他們是不同的，我可以得到的樣式生效是做的唯一途徑 -

#navigation{ 
color:#808080; 
float:left; 
margin-top:50px; 
font-family:"Myriad Pro", Times, serif; 
} 

#login{ 
color:#808080; 
float:right; 
margin-top:50px; 
font-family:"Myriad Pro", Times, serif; 
} 

ul li{ 
display:inline; 
text-decoration:none; 
padding:15px; 
} 

所以我的問題是我怎麼能應用填充15px的導航列表，而不是到登錄列表我試圖把它導航的CSS代碼，但它沒有采取任何行動:(

謝謝！

Answer 1

做到這一點最好的辦法是把普通的款式，然後再更具體的風格

後

ul li { 
    display:inline; 
    text-decoration:none; 
} 

#navigation, #login { 
    color:#808080; 
    margin-top:50px; 
    font-family:"Myriad Pro", Times, serif; 
} 

#navigation { 
    float:left; 
} 

#login{ 
    float:right; 
} 

#navigation li { 
    padding:15px; 
} 

Answer 2

嘗試這樣的：

#navigation li { 
    ... your styles 
} 

#login li { 
    ... your different styles 
} 

您也可以先設置默認李的風格，並覆蓋/添加到他們李毅中#navigation這樣的：

li { 
    ... default styles 
} 

#navigation li { 
    ... styles for navigation list, on top of the default ones 
} 

Answer 3

您需要使用的CSS後裔選擇 - http://www.w3.org/TR/CSS2/selector.html#descendant-selectors：

#navigation li{ 
    display:inline; 
    text-decoration:none; 
    padding:15px; 
} 

#login li{ 
    display:inline; 
    text-decoration:none; 
}