[html] ¿Hay un selector de CSS para el primer hijo directo solamente?


Answers

CSS se llama hojas de estilo en cascada porque las reglas son heredadas. Usando el siguiente selector, seleccionará solo el hijo directo del padre, pero sus reglas serán heredadas por los divs hijos de ese div :

div.section > div { color: red }

Ahora, tanto ese div como sus hijos serán red . Debe cancelar lo que configure en el elemento principal si no desea que herede:

div.section > div { color: red }
div.section > div div { color: black }

Ahora solo ese único div que es un hijo directo de div.section será rojo, pero sus divs hijos seguirán siendo negros.

Question

Tengo el siguiente html

<div class="section">
   <div>header</div>
   <div>
          contents
          <div>sub contents 1</div>              
          <div>sub contents 2</div>
   </div>
</div>

Y el siguiente estilo:

DIV.section DIV:first-child 
{
  ...
}

Por alguna razón, no entiendo que el estilo se aplique al "contenido secundario 1" <div> , así como al "encabezado" <div> .

Pensé que el selector del estilo solo se aplicaría al primer hijo directo de un div con una clase llamada "sección". ¿Cómo puedo cambiar el selector para obtener lo que quiero?




div.section > div



Related