Heim  >  Artikel  >  Web-Frontend  >  Was stellen Doppelpunkte in CSS3-Attributen dar?

Was stellen Doppelpunkte in CSS3-Attributen dar?

青灯夜游
青灯夜游Original
2022-03-18 18:09:132004Durchsuche

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.

Was stellen Doppelpunkte in CSS3-Attributen dar?

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:

jedes

-Elements

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
::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!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn