Primero que nada debo decir que este trabajo, si bien es original mio, esta basado en un articulo que lei en A List Apart, articulo que recomiendo que tambien lean. La razón de escribir esto es, por un lado, la escases de este tipo de documentos en castellano, y por otro lado, no me termina de gustar como esta hecho en el articulo original. :-)
Nota: Si usas IE veras que esta pagina se ve con el texto a lo ancho del total de la pagina. Eso es porque tu explorador no toma correctamente las hojas de estilo. Prueba de entrar con cualquier otro explorador y veras que lo que digo es cierto. Recomendado: Mozilla FireBird.
Para quienes no han leido nunca las especificaciones de HTML o X-HTML les recomiendo que lo hagan, es una lectura agradable. Pueden encontrar estas y otras especificaciones en http://www.w3.org/QA/TheMatrix.
Si leemos la especicifacion, veremos que hay una seccion dedicada
a la etiqueta <link>, etiqueta mediante la cual
podemos, entre otras cosas, especificar la hoja de estilos que usara
la pagina. Estos son los tres modos posibles de aplicar una hoja de
estilos:
Una hoja de estilos persistente es la forma más usual de usar una hoja de estilos. Son aquellas que se declaran del siguiente modo:
<link rel="stylesheet" href="estilo.css" type="text/css" />
Este tipo de hoja de estilo siempre se encuentra activa en la página, a menos que tengamos deshabilitado el uso de CSS.
Son aquellas que deseamos que sea el estilo por defecto al entrar a una
página. Para definirlas solo falta agregarle el atributo title
a la etiqueta link:
<link rel="stylesheet" href="estilo.css" type="text/css" title="Nombre" />
Por último, las hojas de estilos alternativas son las que nos permiten realizar lo que aquí nos proponemos. Estas se especifican del siguiente modo:
<link rel="alternate stylesheet" href="estilo.css" type="text/css"
title="Nombre" />