Como Asociar Una Hoja de Estilo
Ahora que ya sabemos crear hojas de Estilo, el siguiente paso es indicarle a cada página donde se encuentra. Como vimos antes, la Hoja de Estilo puede llamarse como queráis (aunque siempre os he recomendado usar minúsculas y evitar espacios en blanco y simbolos "raros") pero la extensión (las tres letritas que van detras del nombre del archivo) debe ser .css.
Imaginemos que, con la originalidad que nos caracteriza, lo hemos llamado estilo.css. Obviamente tendremos que indicar en cada página la ruta de ese archivo, respecto de esa página y además hay que hacerlo en un sitio y de una forma determinada.
Llamaremos a dicho archivo con la siguiente línea:
<LINK REL="StyleSheet" MEDIA="screen" TYPE="text/css" HREF="estilo.css">
que tendreos que incluir dentro de la cabecera de cada una de las páginas que queramos que use esa Hoja de Estilos, es decir, entre los <HEAD> y </HEAD> de esas páginas. No olvides respetar las comillas.
En dicha línea os he marcado en rojo lo que debería ser la ruta del archivo estilo.css respecto de esa página en concreto. Supongo que habéis sido buenos y buenas y os habéis empapado la lección "Todo Rutas". Si no es así, echarle un vistazo que es muy muy importante. Os recomiendo usar rutas relativas.
Os recuerdo de todos modos que si por ejemplo, el archivo estilo.css está en la misma carpeta que la página, simplemente tenéis que poner el nombre del archivo estilo.css. Si en cambio la página está en una carpeta llamada "mibiografia" y el archivo estilo.css esta en la carpeta anterior a esta (es decir, fuera de "mibiografia") tendréis que poner ../estilo.css. De todas formas, en la sección "Todo Rutas" esta explicado todo esto completa y claramente.
Pues listo. Una vez que habéis insertado esa línea en cada una de las páginas en las que queréis utilizar esos estilos (que seguro que son en todas) el paso siguiente será aprender a utilizarlos, es decir, como indicar a la página que un elemento debe mostrarse con un estilo de los definidos en la Hoja de Estilos. Vamos a verlo en la siguiente lección.
Ya estáis apunto de pasar de ser Webmastercillos a ser WebSuperMasters!! je je je. Tiembla Bill Gates!!!
|
Introdución