CSS combinadores
Un combinador es algo que explica la relación entre los selectores. |
Un selector de CSS puede contener más de un selector simple. Entre los selectores simples, podemos incluir un combinador.
Hay cuatro combinadores diferentes en CSS3:
- selector de descendiente (space)
- selector de hijo (>)
- selector de hermanos adyacentes (+)
- interruptor general de hermanos (~)
selector de descendiente
El selector de descendiente coincide con todos los elementos que son descendientes de un elemento especificado.
El siguiente ejemplo selecciona todos los <p> elementos dentro de <div> elementos:
Selector de niño
El selector niño selecciona todos los elementos que son los hijos inmediatos de un elemento especificado.
El siguiente ejemplo selecciona todos los <p> elementos que son hijos inmediatos de un <div> elemento:
Selector de hermanos adyacentes
El selector de hermanos adyacentes se seleccionan todos los elementos que son los hermanos adyacentes de un elemento especificado.
elementos relacionados deben tener el mismo elemento padre, y "adyacente" significa "inmediatamente después".
El siguiente ejemplo selecciona todos los <p> elementos que se colocan inmediatamente después de <div> elementos:
Selector general del hermano
El interruptor general de hermanos selecciona todos los elementos que son hermanos de un elemento especificado.
El siguiente ejemplo selecciona todos los <p> elementos que son hermanos de <div> elementos:
Ponte a prueba con los ejercicios!
Ejercicio 1 » Ejercicio 2» Ejercicio 3 » Ejercicio 4»