Conceptos básicos de la herencia de estilo CSS3

los en cascada parte de Cascading Style Sheet (CSS3) lo dice todo. Un estilo en la parte superior de la jerarquía de páginas caerá en cascada hacia abajo en la parte baja de la página. Al definir un estilo en el nivel adecuado de la jerarquía, se reduce el trabajo necesario para poner en práctica ese estilo en todos los lugares en los que se necesita el estilo.

Por ejemplo, un estilo que se define con la etiqueta fluirá hacia abajo en el

etiqueta. Si ha definido el estilo en el nivel, se emplea un acceso directo en la forma de un estilo en cascada.

El uso de una arquitectura en cascada significa que usted define estilos que afectan a la página en su conjunto en un nivel más alto que los estilos específicos utilizados para definir elementos particulares.

Por ejemplo, si su página se basa principalmente en una sola fuente, entonces usted debe definir esa fuente en el etiqueta. A pesar de que la jerarquía (DOM) Document Object Model comienza con el documento, se mueve hacia la raíz (la etiqueta), y sólo entonces se divide en la y etiquetas, la etiqueta es el primer elemento en el boton.

La herencia también viene en otra forma. Puede definir estilos en tres lugares diferentes. La ubicación de esta definición modifica la prioridad de ese estilo. Estos son los tres lugares de estilo y sus prioridades:

• Inline (máxima prioridad): Un estilo en línea aparece específicamente con un objeto en particular. Modifica solamente ese objeto y ningún otro objeto en el documento o en cualquier otro documento. Localización y cambiar un estilo en línea es lento y propenso a errores, por lo que debe evitar siempre que sea posible.

• Interna: Un estilo interno aparece como parte de la

  Utilización de estilos internos puede ayudar a proporcionar dinamismo especial a una página en particular, pero debe utilizar un estilo interno sólo cuando el estilo es único a esa página, y nunca la intención de utilizar ese estilo en cualquier otro lugar. Teniendo en cuenta que normalmente no puede hacer esa garantía, lo mejor es evitar los estilos internos siempre que sea posible, pero aún así, son preferibles a inline estilos.

• Externo (prioridad más baja): Un estilo externa aparece en un archivo .css externo. Usted debe crear una referencia a este archivo usando una etiqueta en el de un documento. Los estilos afectan a cada documento vinculado al archivo .CSS.

  El uso de este enfoque hace que las actualizaciones más fácil y le da a su sitio una apariencia uniforme en general. Además, el uso de estilos externos hace que sea fácil para las personas con necesidades especiales para el suministro de una hoja de estilos alternativa que mejor se ajuste a sus necesidades.

  Puede asociar el mayor número de hojas de estilo externa, según sea necesario con una página mediante el uso de múltiples las etiquetas. Este enfoque le permite utilizar estilos de diversas fuentes para que pueda dar formato a su página con la menor cantidad de esfuerzo.

  Hojas de estilo externas se procesan en el orden en el que aparecen. Si dos archivos .CSS contienen el mismo nombre de estilo que modifican las mismas propiedades, el estilo procesado última es el estilo que tiene precedencia.

El nivel final de la herencia a considerar es el propio selector. Puede crear selectores que actúan sólo sobre los objetos contenidos dentro de otros objetos o que cumplan los criterios especiales. Un selector específico siempre anulará la configuración proporcionada por un selector genérico, por lo que sólo debe utilizar esta técnica cuando sea necesario (imagino tratando de encontrar todos esos cambios específicos en todos los archivos en su sitio).

Cuanto más específico sea el selector, mayor será su prioridad se convierte. Sin embargo, debe tener en cuenta los efectos del nivel del selector en el documento - y la forma en que se define el estilo - como parte de la imagen global.