Der Doppelpunkt des CSS3-Attributs zeigt an, dass es sich bei dem Attribut um einen Pseudoelementselektor handelt. Dabei handelt es sich um einen Selektor, mit dem einige Elemente erstellt werden, die sich nicht im DOM-Baum befinden, und ihnen Stile hinzugefügt werden. Zu den CSS3-Pseudoelementen gehören „::after“, „::before“, „::first-letter“, „::first-line“ und so weiter.
Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.
Der Doppelpunkt des CSS3-Attributs zeigt an, dass es sich bei dem Attribut um einen Pseudoelementselektor handelt.
Was sind Pseudoelemente?
Pseudoelemente werden wörtlich als „falsche Elemente“ oder „verkleidete Elemente“ verstanden. Tatsächlich kann es so verstanden werden: Pseudoelemente sind tatsächlich virtuelle Elemente, die nicht existieren (in Codeform), und Sie können sie nicht im Dokument finden, also sind Pseudoelemente virtuelle Elemente.
Pseudo-Element ist ein Selektor, der verwendet wird, um einige Elemente zu erstellen, die sich nicht im DOM-Baum befinden, und ihnen Stile hinzuzufügen.
Mit Pseudoelementen können Sie Stile für bestimmte Teile des ausgewählten Elements definieren, ohne auf die ID oder Klassenattribute des Elements zurückgreifen zu müssen. Mithilfe von Pseudoelementen können Sie beispielsweise den Stil des ersten Buchstabens in einem Absatz festlegen oder Inhalte vor oder nach dem Element einfügen usw.
CSS stellt eine Reihe von Pseudoelementen bereit, wie in der folgenden Tabelle gezeigt:
Pseudoelement | Beispiel | Beispielbeschreibung |
---|---|---|
::after | p::after | Fügen Sie in jedem Element Inhalt nach jedem ein |
::before | p::before | Fügen Sie Inhalt vor jedem -Element ein |
::first-letter | p::first -letter | entspricht dem ersten Buchstaben |
::first-line | p::first-line | entspricht der ersten Zeile | jedes
::selection | p:: Auswahl | entspricht dem vom Benutzer ausgewählten Teil des Elements |
::placeholder | input::placeholder | entspricht dem Platzhalter für jedes Formulareingabefeld (z. B. ) Eigenschaften |
( Lernvideo-Sharing: CSS-Video-Tutorial, Web-Frontend)
Das obige ist der detaillierte Inhalt vonWas stellen Doppelpunkte in CSS3-Attributen dar?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!