Есть ли способ сгруппировать селекторы CSS для ясности?

Question

Если у меня есть дюжина CSS-селекторов, и я хочу назначить :hover свойства для всех из них, я привык делать это:

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
}

вместо

Answer 1

Не изначально в CSS. Используя что-то вроде SCSS , вы можете написать:

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

  &:hover {
    // some more properties
  }
}

Answer 2

Если все они имеют одни и те же свойства наведения, вы можете создать класс, общий для всех, который определяет ваш: hover

Таким образом, вы получите:

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

Повторное использованиеклассы делают для чище и меньше кода.

Answer 3

К сожалению, на самом деле нет более простого способа делать то, что вы пытаетесь сделать, к сожалению.Если вы не хотите перенести стили в jQuery или что-то еще (но это не очень хорошее решение).