Heim >Web-Frontend >CSS-Tutorial >Detaillierte Einführung in die Verwendung des CSS-Unterelementselektors
Detaillierte Einführung in die Verwendung des CSS-Unterelementselektors
- 高洛峰Original
- 2017-03-07 14:40:542526Durchsuche
Der grundlegende Unterelementselektor kann jeweils nur eine Ebene nach unten durchsuchen und nicht kreuzen
HTML-Code:
<p>
this is my <strong><i>w</i>eb</strong> page.
</p>
CSS-Code:
p>strong { color: purple; } p>strong>i { font-size: 50px; }
1. Im Vergleich zum Nachkommenselektor kann der untergeordnete Elementselektor nur Elemente auswählen, die untergeordnete Elemente eines Elements sind.
2. Der Unterelementselektor verwendet das Größer-als-Zeichen „>“ als Konnektor.
Beispiel 1:
<html>
<head>
<style type="text/css">
h1 > strong {
color: red;
}
</style>
</head>
<body>
<h1>This is <strong>very</strong> <strong>very</strong> important.</h1>
<h1>This is <em>really <strong>very</strong></em> important.</h1>
</body>
</html>
Beispiel 2
<html>
<head>
<style type="text/css">
table.company td > p {
color: red;
}
</style>
</head>
<body>
<table class='company'>
<tr>
<td>
<p>hello</p>
</td>
</tr>
</table>
<table>
<tr>
<td>
<p>world</p>
</td>
</tr>
</table>
</body>
</html>
Eine detailliertere Einführung in die Verwendung von CSS-Unterelementselektoren finden Sie auf der chinesischen PHP-Website für verwandte Artikel!
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
Vorheriger Artikel：Beispiel für die Verwendung des CSS-Selektors für benachbarte GeschwisterNächster Artikel：Beispiel für die Verwendung des CSS-Selektors für benachbarte Geschwister