: Selector de primer hijo
p:first-childelementos seleccionados cumplen dos requisitos:
- Es el primer hijo
- Esto pasa a ser un elemento secundario p
Echemos un vistazo a un caso:
p:first-child {
color: red;
}
li:first-child {
color: blue;
}
<div>
<p>These are the necessary steps:</p>
<ul>
<li>Intert Key</li>
<li>Turn key <strong>clockwise</strong></li>
<li>Push accelerator</li>
</ul>
<p>Do <em>not</em> push the brake at the same time as the accelerator.</p>
</div>
análisis:
- La primera regla es "la primera y p es un elemento hijo del elemento" de un conjunto de elementos para el rojo
- La segunda regla es que la "primera y Li elemento es un elemento secundario" es un elemento para establecer el color a azul
Los resultados son los siguientes:
Estos son los pasos necesarios:
- intert clave
- Gire la llave en sentido horario
- acelerador de empuje
No , no empujar el freno al mismo tiempo que el acelerador.
Nota: Si el código HTML en el siguiente caso, el elemento P ya no es un primer hijo, y el primer hijo no son P, por lo que los resultados van a cambiar.
<div>
<ul>These are the necessary steps:</ul>
<ul>
<li>Intert Key</li>
<li>Turn key <strong>clockwise</strong></li>
<li>Push accelerator</li>
</ul>
<p>Do <em>not</em> push the brake at the same time as the accelerator.</p>
</div>
-
Estos son los pasos necesarios:
- intert clave
- Gire la llave en sentido horario
- acelerador de empuje
No , no empujar el freno al mismo tiempo que el acelerador.