Aquí lo leemos como el padre, selector1
, que sea mayor que una etiqueta selector2
o que el selector2
sea hijo directo de un selector1
y a ese hijo agrégale los estilos.
selector1 > selector2 {estilos}
Aquí el código se lee que el padre div
sea mayor a la etiqueta p
o también se lo puede leer como, que la etiqueta p
que sea hijo directo de una etiqueta div
y a la etiqueta p
agrégale los estilos.
div > p {
color: red;
}
Aquí le estamos diciendo que TODOS los selectores2
que estén dentro de una un selector1
se le agregue los estilos.
En el caso que en nuestro HTML tengamos una etiqueta que este adentro de dos etiquetas iguales, CSS ignora al padre menor el que está más cercano al hijo y tiene solamente en cuenta al padre mayor.
En el caso de este HTML se ignora al div2
y solo se tiene en cuenta al div1
.
<div1>
<div2>
<p></p>
</div2>
</div1>
selector1 selector2 {estilos}
En el caso del código le estamos diciendo que ponga de rojo a todas las etiquetas p
que estén dentro de un div
.
div p {
color: red;
}