DISEÑO WEB
|
| |
Hojas de Estilo
La utilización
de hojas de estilo es una herramienta muy potente en la creación
de webs. Podemos utilizarlos para tener un mismo tipo de letra (tamaño,
color, tipo de letra), barra navegación etc.. dentro de un mismo
fichero. Sin embargo no ahorraremos mucho tiempo si una vez definidos
los estilos tenemos que ir introduciendolos fichero por fichero. Para
solventar esta tarea definimos los estilos en un solo documento y acto
seguido se utilizan en el resto de ficheros, con la ventaja de que si
queremos realizar alguna modificacion, unicamente debemos modificar el
fichero principal.
Importar Hojas de Estilo
En primer lugar creamos
un documento con extensión .css en este caso llamado xxx.css,
este incluye todas las definiciones de los estilos. Utilizamos este ejemplo
de definición de estilos:
|
|
| |
<style
type="text/css">
<!--
a{text-decoration:none}
a:hover{text-decoration: underline ; color:black;}
-->
</style> |
|
|
| |
Una
vez creado el fichero xxx.css importamos todos los documentos a traves
de la etiqueta <LINK> que se debe incluir dentro de las etiquetas
<head> y </head>. |
|
| |
<LINK
Rel="stylesheet" HRef="xxx.css"
Type="text/css"> |
|
|
| |
Podemos
importar tantos estilos como queramos, siempre sabiendo que algunos estilos
pueden entrar en conflicto dentro los documentos, por lo que el navegador
tendra en cuenta la última opción leida, es decir la última
linea de importaciones.
Con la opción de la etiqueta <LINK>, no se pueden sustituir
los estilos importados por otros definidos dentro del propio documento,
para ello debemos utilizar la sentencia "@import" dentro
de la etiqueta <style> |
|
| |
<style
type="text/css">
@import URL("xxx.css");
</style> |
|
|
| |
Podemos
importar los estilos que desemos con la sentencia "@import"
incluyendola dentro de la etiqueta <style>, teniendo en
cuenta que si existen conflictos entre los estilos, el navegador tendra
en cuenta la última linea. |
|
| |
|
|
Inicio 
Favoritos 
Directorio 
Recomendar
Buscador 
Mapa