2011-01-25 78 views
7

如果我有十幾個CSS選擇器和要指派:hover屬性,所有的人,我已經習慣了這樣做:有沒有辦法將CSS選擇器分組?

selector, selector2, someOtherSelector, someSelector div { 
    //some properties 
} 
selector:hover, selector2:hover, someOtherSelector:hover, someSelector div:hover { 
    //some properties 
} 

打字:hover四次似乎是多餘的。有沒有辦法像

(selector, selector2, someOtherSelector, someSelector div):hover { 
    //some properties 
} 

而不是?

+0

一個有趣的相關問題,btw:http://stackoverflow.com/questions/800779/why-cant-you-group-descendants-in-a-css-selector?rq=1 – 2016-07-18 19:29:19

回答

4

如果他們都有着相同的屬性懸停你可以創建一個爲所有共享定義一個類你:懸停

所以你會得到:

allSelectors, selector, selector2, someOtherSelector, someSelector div { 
    //some properties 
} 
allSelectors:hover { 
    //some properties 
} 

可重用類使得代碼更乾淨,代碼更少。

3

不幸的是,有not really任何easier way做你想做的事情,不幸的是。除非你想將樣式移動到jQuery或其他東西(但這不是一個好的解決方案)。

4

本機不在CSS中。通過使用類似SCSS,你可以這樣寫:

selector, selector2, someOtherSelector, someSelector div { 
    // some properties 

    &:hover { 
    // some more properties 
    } 
} 
相關問題