Sélecteur de descendants et classes en CSS
Supposons que nous ayons le code suivant :
<div class="block">
<h2>Title</h2>
<p>
text
</p>
</div>
<div class="block">
<h2>Title</h2>
<p>
text
</p>
</div>
Sélectionnons tous les titres h2 et
les paragraphes situés à l'intérieur d'un élément avec la classe
block, et colorons-les avec des couleurs différentes.
Utilisons pour cela le sélecteur de descendants (qui est
un espace entre les sélecteurs) :
.block h2 {
color: red;
}
.block p {
color: green;
}
Voici le code suivant :
<p class="eee">
text <i>italic</i>
</p>
<p class="eee">
text <i>italic</i>
</p>
<div class="eee">
text <i>italic</i>
</div>
<div class="eee">
text <i>italic</i>
</div>
Colorez en rouge toutes les balises i,
situées dans les éléments avec la classe eee.