/* Esto son comentarios de CSS */
/* Esta página se ha creado con el programa Frontpage de Microsoft, aunque también se puede crear con otros editores de texto, como el Block de Notas */
/* Se han marcado los selectores en negrita y se han coloreado los comentarios en rojo para distinguirlos mejor, aunque en el CSS original todo es del mismo color */
/* Esta página se ha guardado como html para poder verla en el Explorador, pero en realidad debería guardarse como EjemploCSS1.css */
/* --------------------------- Aquí empieza la hoja CSS ------------------------- */
/* Estilo del <body> */
body
{
color: navy;
/* color de texto azul marino */
background-color: #F0F8FF; /*
color de fondo blanco sucio */
}
/* Estilo de la cabecera <h1> */
h1
{
background-color: #8A2BE2; /*
color de fondo azul violeta */
color: blue;
/* color de texto azul */
line-height: 22px;
/* espacio entre líneas de texto 22 pixel */
text-align: center;
/* texto alineado a la derecha */
margin-top: 5
cm
/* margen superior del texto 5cm */
}
/* Estilo de las clases ="ruta",
="nombre", ="valor" */
.ruta
{
color: #990099;
/* color del texto berengena */
background-color: #FFFFFF; /*
color de fondo blanco */
line-height: 22px;
/* espacio entre líneas de texto 22 pixel */
text-align: center;
/* texto alineado al centro */
margin-top:
5cm
/* margen superior del texto 5cm */
}
.nombre
{
border-width: 5px;
/* ancho del borde 5 pixel */
color: white;
/* color del texto blanco */
background-color: #CCFFFF; /*
color de fondo azul claro */
line-height: 22px;
/* espacio entre líneas de texto 22 pixel */
text-align: left;
/* texto alineado a la izquierda */
margin-top:
5cm
/* margen superior del texto 5cm */
}
.valor
{
border-width: 8px;
/* ancho del borde 8 pixel */
color: navy;
/* color del texto azul marino */
background-color: #FFCCFF; /*
color de fondo rosa palo */
line-height: 22px;
/* espacio entre líneas de texto 22 pixel */
text-align: left;
/* texto alineado a la izquierda */
margin-top:
5cm
/* margen superior del texto 5cm */
}
/* Estilo del párrafo normal <p> y la clase p.nota */
p
{
font-family: verdana;
/* familia de fuente verdana */
color: navy;
/* color del texto azul marino */
background-color: #F0F8FF; /*
color de fondo blanco sucio */
text-align: left;
/* texto alineado a la izquierda */
margin: 1cm 1cm 1cm
1cm /*
margen del texto 1cm */
}
p.nota
{
font-family: verdana;
/* familia de fuente verdana */
color: navy;
/* color del texto azul marino */
background-color: #F0F8FF; /*
color de fondo blanco sucio */
text-align: left;
/* texto alineado a la izquierda */
font-style: italic
/* estilo de la fuente itálica */
}
/* Estilo de los hiperenlaces <a href ...> */
a:link /* enlace
no visitado */
{
color: blue;
/* color de texto azul */
background-color: #FFFFCC;
/* color de fondo amarillo claro */
text-decoration: none
/* sin decoración de texto */
}
a:visited /*
enlace visitado */
{
color: #FF3300;
/* color de texto naranja */
background-color: #FFFFCC;
/* color de fondo amarillo claro */
text-decoration: none
/* sin decoración de texto */
}
a:active /* enlace
activo */
{
color: #990000;
/* color de texto marrón */
background-color: #FFFFCC;
/* color de fondo amarillo claro */
text-decoration: none
/* sin decoración de texto */
}
/* Estilo de las listas: <ul>desordenada , <li>lista, <ol>ordenada */
ul
{
color: navy; /* color del texto
azul marino */
background-color: #F0F8FF; /*
color de fondo blanco sucio */
list-style-image: url("/imagenes/vinetas/p_verde.gif")
/* cada elemento de la lista desordenada comienza esta imagen */
}
li
{
color: navy;
/* color del texto azul marino*/
background-color: #F0F8FF; /*
color de fondo blanco sucio */
text-decoration: bold;
/* decoración del texto en negrita */
text-align: left;
/* alineación del texto a la izquierda */
margin-top:
5cm
/* margen superior del texto 5 cm */
}
ol
{
color: navy; /* color del texto
azul marino */
background-color: #F0F8FF; /*
color de fondo blanco sucio */
}
/* Estilo de las filas, columnas y celdas de tablas
<tr>, <td>, <th> */
tr
{
color: navy;
/* color del texto azul marino */
background-color: #FFCC99; /*
color de fondo naranja claro */
border-width: 2px /* ancho del borde 2 pixel */
}
th
{
color: #FFFFFF; /* color del texto blanco*/
background-color: #6699CC; /* color del fondo azul grisáceo*/
font-weight: bold; /* ancho de fuente grueso o negrita */
border-width: 2px /* ancho del borde 2 pixel */
text-align: center; /* alineación del texto al centro */
}
td
{
color: navy; /* color del texto azul marino */
background-color: #FFCC99; /* color de fondo naranja claro */
text-align: left; /* alineación del texto a la izquierda */
border-width: 2px /* ancho del borde 2 pixel */
}