Есть ли псевдокласс CSS, противоположный: hover?

Есть ли в CSS псевдокласс для указания

:not(:hover)

Или это единственный способ указать элемент, который не зависает?

Я просмотрел несколько ссылок на CSS3 и не нашел упоминания о псевдоклассе CSS, который бы указывал противоположность: hover.

Да, использовать :not(:hover)

.child:not(:hover){
  opacity: 0.3;
}

jsBin демонстрация

Другой пример; Я думаю, вы хотите: «когда зависает один, затемнять все остальные элементы» .

Если мое предположение верно и если все ваши селекторы находятся внутри одного родителя:

.parent:hover .child{
    opacity: 0.2;      // Dim all other elements
}
.child:hover{
   opacity: 1;         // Not the hovered one
}

.child{
  display:inline-block;
  background:#000;
  border:1px solid #fff;
  width: 50px;
  height: 50px;
  transition: 0.4s;
}

.parent:hover .child{
  opacity: 0.3;
}
.parent .child:hover{
  opacity: 1;
}

<div class="parent">
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
  <div class="child"></div>
</div>

В противном случае ... просто используйте логику по умолчанию:

.child{
   opacity: 0.2;
}
.child:hover{
   opacity: 1;
}

Нет такого псевдокласса. Этого не должно быть, когда можно просто использовать :not(:hover). Вся суть :not()псевдокласса состоит в том, чтобы позволить авторам писать отрицания без необходимости указывать отдельные отрицания для каждого существующего (и будущего) динамического псевдокласса, где элемент может либо совпадать, либо не совпадать с псевдоклассом.

Например, только некоторые элементы могут быть :enabledили :disabled- большинство элементов не являются ни тем, ни другим, потому что семантика просто не применяется - но элемент может быть либо обозначен указывающим устройством ( :hover), либо нет ( :not(:hover)). Предоставление отрицаний, которые уже могут быть получены напрямую с помощью :not(), сильно подорвало бы его полезность (хотя его все равно можно было бы использовать для отрицания любого другого простого селектора или целых сложных селекторов в будущем).

Аргумент, что такой псевдокласс был бы менее затратным в вычислительном отношении, довольно слаб. Самой наивной реализацией такого псевдокласса была бы буквальная :not(:hover)проверка, что было бы не лучше. Любые более сложные или оптимизированные реализации, и вы просите поставщиков реализовать псевдокласс, который работает так же или даже быстрее :not(:hover), чем это уже достаточно необычный вариант использования, учитывая другие варианты, которые у вас есть, такие как каскадирование и :not(:hover)(для всякий раз, когда каскадирование невозможно), к которому у вас есть доступ. Это просто не оправдывает затраты времени и усилий на спецификацию, реализацию и тестирование альтернативы по крайней мере одному другому существующему методу, который является на 100% функционально эквивалентным (и тем, который применим по крайней мере к80% сценариев). И еще есть проблема наименования такого псевдокласса - вы не предложили для него имя, и я не могу придумать хорошего. :not-hoverвсего на два байта короче, и набирать его немного меньше. Во всяком случае, это потенциально более запутанно, чем :not(:hover).

Если вас беспокоит специфичность, обратите внимание, что сам :not()псевдокласс не учитывается для специфичности; есть только его самый конкретный аргумент . :not(:hover)и :hoverстоль же конкретны. Так что конкретность тоже не проблема.

Если вас беспокоит поддержка браузером, такой псевдокласс, если он будет введен, вероятно, был бы введен либо вместе :not(), либо на более позднем уровне селекторов, поскольку он не появился в CSS2 (где :hoverвпервые был введен более 17 лет назад). назад, и впервые реализовано в IE4 годом ранее). Вводить его на более позднем уровне было бы бессмысленно, потому что авторы просто были бы вынуждены продолжать использовать, :not(:hover)пока браузеры все равно не начнут реализовывать этот новый псевдокласс, и у них не было бы причин для переключения.

Обратите внимание, что это не то же самое, что следующий вопрос, в котором говорится о событиях и состояниях (изначально он :focusскорее о чем :hover, но применяется тот же принцип): Есть ли в CSS селектор: blur (псевдокласс)?

Если вы хотите отображать что-то только при наведении курсора на что-то другое, вы можете использовать

selector:not(:hover)

как это:

section{
   font-size:3em;
}

div:not(:hover) + section{
 display:none;
}

<div>Hover on me</div>

<section>Peek A Boo!</section>

При использовании есть несколько необычных эффектов и результатов, :not()о которых следует помнить:

• :not(:not(...)), :not(p::before)невозможно
• :not(*) очевидно, никогда не будет применяться
• :not(.foo)будет соответствовать всему, чего нет .foo, включая такие теги, как <HTML>и<body>
• увеличивает специфичность правила, например: #foo:not(#bar)будет соответствовать тому же элементу, что и более простой #foo, но имеет более высокую специфичность.

andработа с :not:

• Элементы, которые не являются <div>и не являются <span>элементами: body :not(div):not(span){}

orработа с :not, это еще не поддерживается.

• Элементы, которых нет .crazyили .fancy:body :not(.crazy, .fancy){}

Источник MDN

a {
  /*styles*/
} 

это нормальная (не зависшая ссылка)

a:hover {
  /*styles*/
} 

это зависшая ссылка