English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

manuel de référence CSS

règles CSS @

大全 des attributs CSS

Sélecteur d'enfant CSS

Lorsque deux éléments sont séparés par le sélecteur > , il ne correspond qu'aux éléments qui sont des descendants directs du premier élément (éléments enfants). En revanche, lorsque deux éléments sont connectés par le sélecteur d'ancêtre, il correspond à tous les éléments qui sont des ancêtres du premier élément (mais pas nécessairement des parents), peu importe combien de fois ils "sautent" dans le DOM.

Manuel de référence complet des sélecteurs CSS

Exemple en ligne

Sélectionnez tous les éléments <p> qui sont des descendants directs des éléments <div> :

<!DOCTYPE html>
<html>
<title>Base Tutorial Website (oldtoolbag.com)</title>
<head>
<style>
div>p
{
background-color:red;
color:white;
}
div > span {background-color: DodgerBlue;}
</style>
</head>
<body>
<h1>Bienvenue sur le Base Tutorial Website (fr.oldtoolbag.com)</h1>
<div>
<p>Notre adresse URL est : fr.oldtoolbag.com.</p>
<p>Le nom de notre site web est : Base Tutorial Website.</p>
<span>Démonstration du sélecteur d'enfant</span>
</div>
<p>Notre site web vous fournit divers tutoriels de base. Apprenez bien les bases, et vous pourrez aller plus loin !</p>
</body>
</html>
Voyons voir ‹/›

Définition et utilisation

Élément1 > Élément2 {Déclaration de style}

element>element Le sélecteur d'enfant est utilisé pour sélectionner un élément enfant spécifique du parent.

Attention: Un élément non sélectionné ne peut pas directement spécifier un élément enfant du parent.

Compatibilité du navigateur

IEFirefoxOperaChromeSafari

Tous les navigateurs populaires le supportent element>element Sélecteur d'enfant.

Attention:element>elementDans IE8Doit être déclaré en exécutant <!DOCTYPE>

Manuel de référence complet des sélecteurs CSS