Índice

Noción de cascada

En los apartados anteriores hemos constatado cómo es posible tener varias definiciones de estilo, bien en línea, interna(s) o externa(s). En caso de que exista una competencia entre varios elementos de estilo, interviene la noción de "cascada" (la palabra Cascading en Cascading Style Sheets) u orden de prioridad.

El navegador toma primero en consideración las especificaciones de las hojas de estilo externas (con la extensión css), a continuación las hojas de estilo internas (aquellas situadas en el interior de las etiquetas <head>) y, a continuación, las hojas de estilo en línea (aquellas ligadas a un elemento HTML5).

De este modo, en caso de conflicto entre una especificación de estilo definida al mismo tiempo en una hoja de estilo externa y en una hoja de estilo interna, la especificación que prevalece en el navegador es la correspondiente a la hoja de estilo interna. Del mismo modo, en caso de conflicto entre una hoja de estilo interna y una declaración en línea, es la última la que prevalece.

El orden creciente de prioridad (de menor a mayor) es:

1. Propiedades por defecto del navegador.

2. Hojas de estilo externas.

3. Hojas de estilo internas.

4. Hojas de estilo en línea.

Los estilos declarados en la hoja de estilo en línea tienen, por tanto, la prioridad más alta.

La regla de prioridad para visualizar el documento en el navegador consiste en utilizar la hoja de estilo más próxima al elemento.

Ejemplo

Definamos ...