We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS

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
La definición de 'child combinator' en esta especificación.
Working Draft  
Selectors Level 3
La definición de 'child combinators' en esta especificación.
Recommendation Sin cambios
CSS Level 2 (Revision 1)
La definición de 'child selectors' en esta especificación.
Recommendation Definición inicial

Compatibilidad de navegadores

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

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,