La Declaración !important en CSS, parte 1

Las hojas de estilo en cascada (CSS por su nombre en inglés, Cascading Style Sheets ) deben su denominación a la forma en que actúan sobre los atributos de una página web. Los archivos CSS contienen un lenguaje que modifica la apariencia y el formato de los elementos descritos en la definición del sitio. Vale decir que alteran el aspecto de los objetos definidos en archivos HTML, XHTML y otros utilizados para similares efectos. Pero esta influencia sobre el aspecto de texto, los elementos gráficos y otros, tiene un orden.  “En cascada” significa que si una declaración CSS modifica a una anterior, la válida es la última que el navegador encuentre. Sin embargo, en ciertas ocasiones es necesario establecer excepciones. Para esto es útil la declaración !important.

La Secuencia CSS Normal

Las declaraciones de las hojas de estilo en cascada (CSS) se aplican según el orden en que el navegador las encuentra. Cada vez que el explorador lee un estilo para un elemento determinado de la página web, este estilo es el que se aplica. Con lo cual la última declaración de estilo reemplaza al anterior, si lo hubo. En realidad, para ser más específicos, cada elemento tiene una importancia relativa que depende de varios factores. El orden inicial en cuanto al origen de la declaración de estilo es el siguiente:

Ejemplo:

Estilo del navegador: font-size: 12px

Estilo del autor de la página: font-size: 14px

En esta secuencia,  el estilo por defecto es el de menor importancia y el establecido por el diseñador el más importante y con prioridad sobre los demás. El tamaño del tipo de letra será de 14 puntos, que modifica el de 12 puntos que veíamos antes de cargar nuestra página.

La Declaración !important en la Secuencia

La declaración !important en CSS sirve para preservar un estilo, a pesar de que luego sea modificado por otra declaración. Vale decir que el formato establecido por una sentencia que incluya !important, no varía aunque  luego se defina un formato que lo contradiga.  Por ello, desde que se estableció el uso de este concepto, el orden según el origen pasó a ser determinado por la siguiente secuencia:

En este caso, los estilos por defecto del navegador y los del usuario tienen la mínima importancia, y los estilos definidos por el usuario con una declaración !important son los de mayor prioridad, incluso mayor que aquellos del autor que incluyan la misma declaración. Esto permite al usuario final modificar, por ejemplo, una plantilla, sin necesidad de tener que adoptar los estilos que el diseñador  haya definido, así contengan el mandato !important.

En la segunda parte ahondaremos en cuándo y cómo usar la propiedad !important de CSS.

Autor: Verónica Milán, directora de lawebera.es, un portal dedicado al diseño web y maquetación, dirigido al diseñador web y creativo.