Gibt es einen funktionalen Unterschied zwischen den CSS 2.1- :after
und den CSS 3 ::after
-Pseudoselektoren (außer ::after
dass sie in älteren Browsern nicht unterstützt werden)? Gibt es einen praktischen Grund, die neuere Spezifikation zu verwenden?
quelle
:after
und::after
austauschbar verwenden, mit Ausnahme von IE8, für das, wie in der Frage angegeben, der einzelne Doppelpunkt erforderlich ist.CSS-Selektoren wie
::after
sind einige virtuelle Elemente, die nicht als explizites Element im DOM-Baum verfügbar sind. Sie werden " Pseudo-Elemente " genannt und werden verwendet, um Inhalte vor / nach einem Element einzufügen (zB :::before
,::after
) oder einen Teil eines Elements auszuwählen (zB :)::first-letter
. Derzeit gibt es nur 5 Standard-Pseudoelemente :after, before, first-letter, first-line, selection
.Auf der anderen Seite gibt es auch andere Arten von Selektoren „genannten Pseudo-Klassen “ , das eine zu definieren , wird verwendet , besonderen Zustand eines Elements (wie als
:hover
,:focus
,:nth-child(n)
). Diese wählen das gesamte vorhandene Element in DOM aus. Pseudoklassen sind eine lange Liste mit mehr als 30 Elementen.Anfänglich (in CSS2 und CSS1) wurde die Single-Colon-Syntax sowohl für Pseudoklassen als auch für Pseudoelemente verwendet. In CSS3
::
ersetzte die Syntax jedoch die:
Notation für Pseudoelemente, um sie besser unterscheiden zu können.Aus Gründen der Abwärtskompatibilität ist die alte Single-Colon-Syntax für Pseudoelemente wie as akzeptabel
:after
(alle Browser unterstützen die alte Syntax weiterhin mit einem Semikolon). Nur IE-8 unterstützt die neue Syntax nicht (verwenden Sie einen Doppelpunkt, wenn Sie IE8 unterstützen möchten).quelle