Selector de descendientes y clases en CSS
Supongamos que tenemos el siguiente código:
<div class="block">
<h2>Title</h2>
<p>
text
</p>
</div>
<div class="block">
<h2>Title</h2>
<p>
text
</p>
</div>
Seleccionemos todos los títulos h2 y
párrafos que se encuentren dentro del elemento con la clase
block, y coloreémoslos en diferentes colores.
Usemos para esto el selector de descendientes (que es
un espacio entre selectores):
.block h2 {
color: red;
}
.block p {
color: green;
}
Se da el siguiente código:
<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>
Colorea en rojo todas las etiquetas i,
que se encuentren en elementos con la clase eee.