Dieser Artikel enthält eine Zusammenfassung (Code) zur Verwendung von Pseudoelementen in CSS. Ich hoffe, dass er für Freunde hilfreich ist.
Setzen Sie den ersten Buchstaben des Textes auf einen Sonderbuchstaben
<!DOCTYPE html >
<html>
<head>
<meta charset="utf-8">
<title>自学教程(如约智惠.com)</title>
<style >
p:first-letter {
color:#ff0000;
font-size:xx-large;
}
</style>
</head>
<body>
<p>你可以使用"first-letter"伪元素向文本的首字母设置特殊样式；</p>
</body>
</html>Setzen Sie die erste Textzeile auf einen Sonderbuchstaben
<!DOCTYPE html >
<html>
<head>
<meta charset="utf-8">
<title>自学教程(如约智惠.com)</title>
<style >
p:first-letter {
color:#ff0000;
font-size:xx-large;
}
</style>
</head>
<body>
<p>你可以使用"first-letter"伪元素向文本的首字母设置特殊样式；</p>
</body>
</html>Setzen Sie den ersten Buchstaben der ersten Textzeile auf „Spezial“
<!DOCTYPE html >
<html>
<head>
<meta charset="utf-8">
<title>自学教程(如约智惠.com)</title>
<style >
p:first-letter{
color:#ff0000;
font-size:xx-large;
}
p:first-line {
color:#0000ff;
font-variant:small-caps;
}
</style>
</head>
<body>
<p>你可以结合使用"first-line"和"first-letter"伪元素向文本的首行和首字母设置特殊样式。</p>
</body>
</html>Verwendung: Fügen Sie vor einem Element etwas Inhalt ein
<!DOCTYPE html >
<html>
<head>
<meta charset="utf-8">
<title>自学教程(如约智惠.com)</title>
<style >
h1:before {content:url(smiley.gif);}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>The :before pseudo-element inserts content before an element.</p>
<h1>This is a heading</h1>
<p><b>注意:</b>仅当 !DOCTYPE 已经声明 IE8 支持这个内容属性</p>
</body>
</html>Verwendung: Fügen Sie einige Inhalte nach einem Element ein
<!DOCTYPE html >
<html>
<head>
<meta charset="utf-8">
<title>自学教程(如约智惠.com)</title>
<style >
h1:after {content:url(smiley.gif);}
</style>
</head>
<body>
<h1>This is a heading</h1>
<p>The :before pseudo-element inserts content before an element.</p>
<h1>This is a heading</h1>
<p><b>注意:</b>仅当 !DOCTYPE 已经声明 IE8 支持这个内容属性</p>
</body>
</html>Verwandte Empfehlungen:
css pseudo-class, pseudo-element_html/css_WEB-ITnose
CSS-Pseudoklasse pseudo-element_html/css_WEB-ITnose
Das obige ist der detaillierte Inhalt vonZusammenfassung der Verwendung von Pseudoelementen in CSS (Code). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
