Was ist der Unterschied zwischen „:“ und „::“ in CSS?

Unterschied: Ein Doppelpunkt ist eine Pseudoklasse und zwei Doppelpunkte sind Pseudoelemente.

(Empfohlenes Tutorial: CSS-Tutorial)

Pseudoklassen können Stile unabhängig von den Elementen des Dokuments zuweisen und können jedem Element zugewiesen werden. Logisch und funktional ähneln sie Klassen, sind jedoch vordefiniert und existieren nicht in Der Dokumentbaum verfügt über unterschiedliche Ausdrucksmethoden und wird daher als Pseudoklasse bezeichnet.

Der von einem Pseudoelement gesteuerte Inhalt ist derselbe wie der von einem Element gesteuerte Inhalt, aber das Pseudoelement existiert nicht im Dokumentbaum und ist kein echtes Element, daher wird es als Pseudoelement bezeichnet.

Pseudo-Klassen umfassen: :first-child, :link:, vistited, :hover:, active:focus, :lang

Pseudo-Elemente umfassen: :first-line, :first-letter, :before, :after

Der Unterschied zwischen Pseudoklassen und Pseudoelementen:

Pseudoklassen

Pseudoklassenauswahlelemente basieren auf dem aktuellen Status des Elements oder den aktuellen Eigenschaften des Elements und nicht auf statischen Zeichen wie dem ID, Klasse, Attribute usw. des Elements. Da sich der Status dynamisch ändert, erhält ein Element möglicherweise einen Pseudoklassenstil, wenn sich der Status ändert. Daraus ist ersichtlich, dass seine Funktion der einer Klasse etwas ähnelt, sie jedoch auf der Abstraktion außerhalb des Dokuments basiert und daher als Pseudoklasse bezeichnet wird. Die Pseudoklasse

:link

wird auf nicht besuchte Links angewendet und schließt sich gegenseitig mit :visited aus. Die Pseudoklasse

:hover

wird auf das Element angewendet, über dem sich der Mauszeiger befindet. Die Pseudoklasse

:active

wird auf aktivierte Elemente wie angeklickte Links, gedrückte Schaltflächen usw. angewendet. Die Pseudoklasse

:visited

wird auf Links angewendet, die besucht wurden, und schließt sich gegenseitig mit :link aus. Die Pseudoklasse

:focus

wird auf Elemente angewendet, die den Tastatureingabefokus haben. Die Pseudoklasse

:first-child

wird angewendet, wenn das Element zum ersten Mal auf der Seite erscheint. Die Pseudoklasse

:lang

wird auf Elemente mit der angegebenen Sprache angewendet.

(Lernvideo-Empfehlung: CSS-Video-Tutorial)

Pseudo-Element

Anders als Pseudo-Klassen, die auf Elemente in speziellen Zuständen abzielen, operieren Pseudo-Elemente auf bestimmte Inhalte im Element, und die Ebene, auf der sie operieren, ist höher als die von Pseudo-Elementen. Klassen sind eine Ebene tiefer und daher viel weniger dynamisch als Pseudo-Klassen.

Tatsächlich besteht der Zweck des Entwurfs von Pseudoelementen darin, den ersten Buchstaben (Buchstaben) und die erste Zeile des Elementinhalts sowie die Vorder- oder Rückseite bestimmter Inhalte auszuwählen, was mit normalen Selektoren nicht möglich ist. Der von ihm gesteuerte Inhalt ist tatsächlich derselbe wie das Element, es handelt sich jedoch nur um eine auf dem Element basierende Abstraktion, die im Dokument nicht vorhanden ist und daher als Pseudoelement bezeichnet wird. Der Stil des Pseudoelements

::first-letter

wird auf den ersten Buchstaben des Texts des Elements angewendet. Der Stil des Pseudoelements

::first-line

wird auf die erste Zeile des Texts des Elements angewendet.

::before

Fügen Sie neuen Inhalt am Anfang des Elementinhalts hinzu.

::after

Fügen Sie am Ende des Elementinhalts neuen Inhalt hinzu.

Das obige ist der detaillierte Inhalt vonWas ist der Unterschied zwischen „:“ und „::“ in CSS?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!