Otra manera de definir estilos en un archivo externo

También podemos incluir estilos en un archivo externo con un código con la sintaxis @import url(«estilo.css»). Se utiliza para definir estilos comunes cuando hay también definición de estilos específicos.

Veamos ahora otra manera de importar una declaración externa de estilos CSS: @import url(«archivo_a_importar.css»), que se utiliza para importar unas declaraciones de estilos guardadas en la ruta que se indica entre paréntesis. (las comillas son opcionales, pero los paréntesis son obligatorios, por lo menos, en Explorer).

Se debe incluir en la declaración de estilos global a una página, es decir entre las etiquetas

, que se colocan en la cabecera del documento.

Es importante señalar que la sentencia de importación del archivo CSS se debe escribir en la primera línea de la declaración de estilos, algo parecido al código siguiente.

El funcionamiento es el mismo que si escribiésemos todo el fichero a importar dentro de las etiquetas de los estilos, con la salvedad de que, si redefinimos dentro del código HTML (entre las etiquetas

) estilos que habían quedado definidos en el archivo externo, los que se aplicarán serán los que hayamos redefinido.

Así, en el ejemplo anterior, aunque hubiésemos definido en estilo.css un color de fondo para la página, el color que prevalecería sería el definido a continuación de la importación: #ffffcc

La diferencia entre este tipo de importación del tipo y la que hemos visto anteriormente:

Es que @import url («estilo.css») se suele utilizar cuando hay unas pautas básicas en el trabajo con los estilos (que se definen en un archivo a importar) y unos estilos específicos para cada página, que se definen a continuación, dentro del código HTML entre las etiquetas

, como es el caso del ejemplo visto anteriormente.