Pseudo-Elemente im CSS-Tutorial für Fortgeschrittene

Pseudoelemente saugen Selektoren wie Pseudoklassen unter Verwendung der Form selector:pseudoelement { property: value; Es gibt vier Saugnäpfe.
Erster Buchstabe und erste Zeile
Das Pseudoelement „Anfangsbuchstabe“ wird auf den ersten Buchstaben des Elements angewendet, und die erste Zeile ist die oberste Zeile des Elements. Sie könnten beispielsweise einen Absatz mit einer fetten ersten Zeile und einer Initiale erstellen, etwa so:
p:first-letter {
font-size: 3em; float: left; >p:first-line {
font-weight: Bold;
}
Vorher und Nachher
Die Vorher- und Nachher-Pseudoelemente und Inhaltsattribute werden auf beiden Seiten des Elements verwendet, ohne das zu ändern HTML Im Falle einer Änderung des Inhalts beider Seiten der Sache.
Der Wert des Inhaltsattributs kann Open-Quote (offene Anführungszeichen), Close-Quote (geschlossene Klammern), No-Open-Quote (keine offenen Klammern), No-Close-Quote (keine geschlossenen Klammern) sein. Alle eingeschlossenen Anführungszeichen. Für Zeichenfolgen oder Bilder verwenden Sie url(Bildname).
blockquote:before {
content: open-quote;}
blockquote:after {
content: close-quote; Inhalt: "POW: "
}
p:before {
Inhalt: url(images/jam.jpg)
}
Hinweis
Klingt gut, nicht wahr? Nun, es gibt so viele davon (pfui, seufz), dass die meisten Benutzer die Vorher- und Nachher-Effekte nicht sehen können, weil der IE von ihnen besessen ist. Faul...

Weitere Artikel zu CSS-Pseudoelementen für fortgeschrittene Tutorials finden Sie auf der chinesischen PHP-Website (
www.php.cn
)!