Loading...

osCurve TiendaOnline Software de RegNow y ClickBank


Introducción a CSS La sintaxis formal del selector




Introducción a CSS
La sintaxis formal del selector descendente se muestra a continuación:
elemento1 elemento2 elemento3 ... elemento N
Los selectores descendentes siempre están formados por dos o más partes
separadas entre sí por espacios en blanco. La última parte indica el elemento
 sobre el que se aplican los estilos y todas las partes anteriores indican el lugar
 en el que se tiene que encontrar ese elemento para que los estilos se apliquen
 realmente.
En el siguiente ejemplo, el selector descendente se compone de cuatro partes:
p a span em { text-decoration: underline; }
Los estilos de la regla anterior se aplican a los elementos de tipo que se encuentren dentro de elementos de tipo , que a su vez se encuentren


.
No debe confundirse el selector descendente con la combinación de selectores:
/* El estilo se aplica a todos los elementos "p", "a", "span" y "em" */
p, a, span, em { text-decoration: underline; }
/* El estilo se aplica solo a los elementos "em" que se
encuentran dentro de "p a span" */
p a span em { text-decoration: underline; }
Si se emplea el selector descendente combinado con el selector universal, se
 puede restringir el alcance de un selector descendente. El siguiente ejemplo,
muestra los dos enlaces de color rojo: p a { color: red; }
Enlace

Enlace

Sin embargo, en el siguiente ejemplo solamente el segundo enlace se muestra
 de color rojo:
p * a { color: red; }
Enlace

Enlace

La razón es que el selector p * a se traduce como todos los elementos de tipo
 dentro de un elemento de tipo
. Como el primer elemento se encuentra directamente bajo un elemento
, no se
cumple la condición del selector p * a.
Fuente: Introducción a CSS
Javier Eguíluz Pérez
www.librosweb.es