Was bedeutet der Doppelpunkt ( ::
) in CSS?
Beispielsweise:
input[type=text]::-ms-clear { display: none; }
Es bedeutet Pseudoelement- Selektor. Dies bedeutet, dass das Element rechts im normalen DOM nicht vorhanden ist, aber ausgewählt werden kann.
Ein Pseudoelement besteht aus zwei Doppelpunkten (: :), gefolgt vom Namen des Pseudoelements.
Es war ursprünglich nur ein einziger Doppelpunkt, aber geändert wurde es von unterscheiden Klassen pseudo (wie :hover
, :first-child
, :not
usw.). Es ist am besten, :
für before
und after
Pseudo-Elemente zu verwenden, da der einzelne Doppelpunkt eine bessere Browserunterstützung bietet, und zwar in früheren IE-Versionen.
Der ::
Operator gibt an, dass Sie ein Pseudoelement auswählen , das nicht als Element vorhanden ist, aber dennoch für das Styling ausgewählt werden kann.
Beispiele hierfür sind mehrere herstellerspezifische Implementierungen, wie das von -ms-clear
Ihnen bereitgestellte Beispiel. Die meisten Browser verfügen auch über Pseudoelemente zum Gestalten von Bildlaufleisten und anderen nativen UI-Elementen. Es gibt jedoch auch viele vordefinierte Pseudoelemente, auf die aus praktischen Gründen verwiesen werden kann. wie first-line
und first-letter
.
Mit den Elementen :before
und :after
Pseudo können Sie sogar mithilfe der content
Regel mithilfe von CSS tatsächlichen Inhalt in die Seite einfügen .
CSS3 ändert die Art und Weise, wie Pseudoelemente ausgewählt werden, da der W3C Pseudoklassen wie a:visited
von Pseudoelementen wie unterscheiden wollte p::first-line
. Siehe Erweiterte CSS-Selektoren .