: hover но: не по определенному классу

Question

Как применить эффект наведения на элемент a, но не на элемент a с классом active?

a:hover(not: .active)

Кажется, что-то не хватает.

Answer 1

Функциональная запись включена :not(), а не :hover:

a:not(.active):hover

Если вы предпочитаете ставить :hover первым, это нормально:

a:hover:not(.active)

Это нене имеет значения, какой псевдокласс приходит первым или последним;в любом случае селектор работает одинаково.Это просто мое личное соглашение ставить :hover последним, так как я склонен размещать псевдоклассы взаимодействия с пользователем позади структурных псевдоклассов.

Answer 2

Вы можете использовать селектор not().

a:not(.active):hover { ... }

Однако это может работать не во всех браузерах, поскольку не все браузеры поддерживают функции CSS3.

Если вы нацелены на большую аудиторию и хотите поддерживать старые браузеры, лучшим способом было бы определить стиль для .active:hover и отменить все, что вы делаете в a:hover.