Archivo para Octubre, 2010

Selectores de estilo descendientes en hojas de cascada

22 de Octubre de 2010

Definir estilos en elementos específicos

Los selectores descendientes en CSS permiten definir los estilos en los elementos que se encuentran en lugares específicos en la estructura del documento XHTML. Estos selectores se definen como patrones, para que pueda definir los elementos hijo, nieto, etc.

Definir un selector descendiente por la separación de los elementos pertinentes, con el espacio:
p div (background-color: # ccc;)

Esto repercutirá en todos los elementos p que están dentro de un elemento div. Pero los elementos p que estén dentro del cuerpo del documento no se verían afectados.

También podemos utilizar patrones para definir sus selectores:
* em div (background-color: # marco de cooperación;)

Esto afectará a todos los elementos em, nietos de un elemento div. En otras palabras, cualquier em que está por debajo de los dos elementos div. Por ejemplo:
<div> <p> <em> Esta es una </ em> </ p> <em> Este no es un </ em> </ div>

Compatibilidad con exploradores

El selector de descendiente con los patrones no funciona en Netscape 4 ó IE 4 Windows e IE 5 (Macintosh).

Selectores de estilo Hijos en hojas de cascada Las definiciones precisas de los estilos CSS

22 de Octubre de 2010

En CSS un elemento primario es un elemento que contiene otros elementos. Todos los elementos que están contenidos dentro de ese padre se llaman “hijo”. Usar el selector CSS hijo, puede definir propiedades que sólo afectan a elementos que son hijos de otros elementos específicos. Cada elemento es un hijo de otro elemento, excepto el elemento raíz, que no tiene padre.

Para seleccionar todos los párrafos que son hijos de la etiqueta <body>, escribiríamos:
body> p (background-color: # 00f;)

Esto es similar al selector descendiente, pero sólo se pueden definir los hijos, nietos o inferior.

Podemos combinar los selectores hijos con los selectores de otro tipo, como descendientes:
div ul li> p (background-color: # 00f;)
Esto afecta a los elementos a la AP que es un descendiente de Li, que es un hijo de ul que es un descendiente de div.

Compatibilidad con exploradores

Internet Explorer 6 e inferior (Windows) y 4.5 e inferiores (Macintosh) no son compatibles con este selector. Netscape 4 e inferiores no son compatibles con este selector.