Gibt es eine entgegengesetzte CSS-Pseudoklasse zu: schweben?

Gibt es in CSS eine Pseudoklasse anzugeben?

:not(:hover)

Oder ist dies die einzige Möglichkeit, ein Element anzugeben, das nicht schwebt?

Ich habe mehrere CSS3-Referenzen durchgesehen und sehe keine Erwähnung einer CSS-Pseudoklasse, um das Gegenteil von: hover anzugeben.

Ja, benutze :not(:hover)

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

jsBin Demo

Ein anderes Beispiel; Ich denke, Sie möchten: "Wenn einer schwebt, dimmen Sie alle anderen Elemente" .

Wenn meine Annahme richtig ist und alle Ihre Selektoren sich im selben übergeordneten Element befinden:

.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>

Andernfalls ... verwenden Sie einfach die Standardlogik:

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

Es gibt keine solche Pseudoklasse. Es muss nicht sein, wenn Sie nur verwenden können :not(:hover). Der springende Punkt der :not()Pseudoklasse besteht darin, den Autoren das Schreiben von Negationen zu ermöglichen, ohne separate Negationen für jede vorhandene (und zukünftige) dynamische Pseudoklasse angeben zu müssen, bei denen ein Element nur entweder mit der Pseudoklasse übereinstimmen kann oder nicht.

Zum Beispiel können nur einige Elemente entweder sein :enabledoder :disabled- die meisten Elemente sind keine, weil die Semantik einfach nicht zutrifft - aber ein Element kann nur entweder vom Zeigegerät ( :hover) oder nicht ( :not(:hover)) festgelegt werden. Das Bereitstellen von Negationen, die bereits direkt mit erreicht werden können, :not()würde seine Nützlichkeit erheblich beeinträchtigen (obwohl es immer noch verwendet werden könnte, um andere einfache Selektoren - oder ganze komplexe Selektoren in der Zukunft - zu negieren ).

Das Argument, dass eine solche Pseudoklasse rechnerisch günstiger wäre, ist ziemlich schwach. Die naivste Implementierung einer solchen Pseudoklasse wäre eine wörtliche :not(:hover)Prüfung, die nicht besser wäre. Bei komplexeren oder optimierten Implementierungen fordern Sie die Anbieter auf, eine Pseudoklasse zu implementieren, die entweder so schnell oder sogar schneller als :not(:hover)ist. Dies ist in Anbetracht der anderen Optionen, die Sie haben, wie z. B. Kaskadierung und :not(:hover)(für) , für einen Anwendungsfall bereits ungewöhnlich genug wenn Kaskadierung keine Option ist), auf die Sie sofort zugreifen können. Es rechtfertigt einfach nicht den Zeit- und Arbeitsaufwand, eine Alternative zu mindestens einer anderen vorhandenen Methode zu spezifizieren, zu implementieren und zu testen, die zu 100% funktional äquivalent ist (und die zumindest für mindestens eine gilt)80% der Szenarien). Und es gibt auch das Problem, eine solche Pseudoklasse zu benennen - Sie haben keinen Namen dafür vorgeschlagen, und ich kann mir auch keinen guten vorstellen. :not-hoverist nur um zwei Bytes kürzer und nur unwesentlich weniger zu tippen. Wenn überhaupt, ist es möglicherweise mehr verwirrend als :not(:hover).

Wenn Sie sich Sorgen um die Spezifität machen, beachten Sie, dass die :not()Pseudoklasse selbst nicht für die Spezifität gezählt wird. nur das spezifischste Argument ist . :not(:hover)und :hoversind gleichermaßen spezifisch. Spezifität ist also auch kein Thema.

Wenn Sie sich Sorgen über die Browserunterstützung machen, wäre eine solche Pseudoklasse, falls sie eingeführt wurde, wahrscheinlich entweder neben :not()oder in einer späteren Ebene von Selektoren eingeführt worden, da sie nicht in CSS2 (wo sie :hovererstmals seit mehr als 17 Jahren eingeführt wurde) enthalten war vor und erstmals ein weiteres Jahr zuvor in IE4 implementiert). Eine spätere Einführung wäre sinnlos, da die Autoren lediglich gezwungen wären, die Verwendung fortzusetzen, :not(:hover)bis die Browser ohnehin mit der Implementierung dieser neuen Pseudoklasse beginnen, und sie keinen Grund hätten, zu wechseln.

Beachten Sie, dass dies nicht mit der folgenden Frage identisch ist, die sich mit Ereignissen und Zuständen befasst (ursprünglich geht es :focuseher um als :hover, aber es gilt dasselbe Prinzip): Verfügt CSS über einen: Blur-Selektor (Pseudoklasse)?

Wenn Sie etwas nur anzeigen möchten, wenn Sie mit der Maus über etwas anderem schweben, können Sie es verwenden

selector:not(:hover)

so was:

section{
   font-size:3em;
}

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

<div>Hover on me</div>

<section>Peek A Boo!</section>

Es gibt einige ungewöhnliche Effekte und Ergebnisse bei der Verwendung :not(), die Sie berücksichtigen sollten:

• :not(:not(...)), :not(p::before)Ist nicht möglich
• :not(*) würde offensichtlich nie angewendet werden
• :not(.foo)passt zu allem, was nicht ist .foo, einschließlich Tags wie <HTML>und<body>
• erhöht die Spezifität einer Regel, zum Beispiel: entspricht #foo:not(#bar)dem gleichen Element wie das einfachere #foo, hat jedoch eine höhere Spezifität.

andBetrieb mit :not:

• Elemente, die keine <div>und keine <span>Elemente sind: body :not(div):not(span){}

orBetrieb mit :not, dies wird noch nicht gut unterstützt.

• Elemente, die nicht sind .crazyoder .fancy:body :not(.crazy, .fancy){}

Quell- MDN

a {
  /*styles*/
} 

ist ein normaler (nicht schwebender Link)

a:hover {
  /*styles*/
} 

ist ein schwebender Link