MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

Selectores de hijo

El combinador > separa a dos selectores y busca solo a los elementos que coindicen con el segundo selector y que son hijos directos del primero. EN contraste, cuando se combinan dos selectores con el selector de descendiente, la expresión busca elementos que coinciden con el segundo selector y que tienen algun ancestro que coindice con el primero, sin importar el nivel de separación que tengan dentro del DOM.

Sintaxis

selector1 > selector2 { style properties }

Ejemplo

span { background-color: white; }
div > span {
  background-color: DodgerBlue;
}
<div>
  <span>Span #1, dentro del div.
    <span>Span #2, dentro del span que está en el div.</span>
  </span>
</div>
<span>Span #3, no está dentro del div.</span>

Especificaciones

Especificación Estatus Comentarios
Selectors Level 4
The definition of 'child combinator' in that specification.
Working Draft  
Selectors Level 3
The definition of 'child combinators' in that specification.
Recommendation Sin cambios
CSS Level 2 (Revision 1)
The definition of 'child selectors' in that specification.
Recommendation Definición inicial

Compatibilidad de navegadores

Característica Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari
Soporte básico (Yes) (Yes) (Yes) 7.0 (Yes) (Yes)
Característica Android Edge Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Soporte básico ? (Yes) ? ? ? ?

Etiquetas y colaboradores del documento

 Colaboradores en esta página: maguz727, israel-munoz
 Última actualización por: maguz727,