從全球的造型

Question

我設置列表項的風格，像這樣不計的ID：

ul.list li { 
    background: #FFFFFF; 
    padding: 0 5px 0 5px; 
    height: 20px; 
} 

ul.list li:hover { 
    background: #F7F7F7; 
} 

但我想定義一個特殊列表項的列表的標題只是它繼承了先前定義的樣式太。我知道我可以給一個班的上述造型，但感覺很麻煩。我是否必須手動「撤消」特殊列表項目的所有內容或給上述樣式設置類？還是有更好的方法來做到這一點？也許我不應該爲標題使用列表項目？

ul.list li.header { 
    font-size: 16px; 
    font-weight: bold; 
} 

Answer 1

如果列表的標題必須在名單內，我可能只是（你提到）「手動撤消」他們：

ul.list li.header { 
    font-size: 16px; 
    font-weight: bold; 

    background: transparent; 
    padding: 0; 
    height: auto; 
} 

它不是那麼糟糕。

---

如果你只需要支持modern browsers，你可以這樣做：

.list li:not(:first-child) { 
    background: #FFFFFF; 
    padding: 0 5px 0 5px; 
    height: 20px; 
} 
.list li:first-child { 
    font-size: 16px; 
    font-weight: bold; 
} 

.list li:hover { 
    background: #F7F7F7; 
} 

這消除了任何類的需求（儘管你可以用.header取代:first-child如果你想保持這一類）。

Answer 2

如果你是自由地使用先進的CSS3選擇器，你可以使用:not()選擇：

ul.list li:not(.header) { 
    background: #FFFFFF; 
    padding: 0 5px 0 5px; 
    height: 20px; 
} 

否則，你就得手動覆蓋它們。