(Anterior)
HTML / XHTML a Detalle (Parte 2)
/* css/estilo.css */
/* Definir el Color de Fondo y Tamaño de letra de la Página */
body { background-color: #FFFFFF; }
/* Para definir una Imagen de Fondo */
/* body { background: url(imagenes/logo.gif) */
|
/* Definir Tipo de Letra para una gran mayoria de Tags */
h1, h2, h3, h4, h5, h6, body, a, p, ul, ol, td, th,
blockquote, textarea, input, select, form {
font-family: arial, helvetica, sans-serif
}
|
/* Definir tipos de letras para tags especiales */
pre, code { font-family: monospace }
|
/* Definir Sangría para cada salto de párrafo */
p {text-indent: 3em }
p.sinsangria {text-indent: 0em}
|
/* Definir tamaño de letra para Títulos */
h1 { font-size: 18pt }
h2 { font-size: 14pt }
h3 { font-size: 14pt }
h4 { font-size: 12pt }
h5 { font-size: 10pt }
h6 { font-size: 8pt }
|
/* Definir el tipo de Incisos "Bullets" para Lista enumerdas*/
ol ol li {list-style: decimal}
ol ol ol li {list-style: upper-alpha}
ol ol ol ol li {list-style: lower-alpha}
ol ol ol ol ol li {list-style: lower-roman}
|
/* Definir el tipo de Incisos "Bullets" para Listas sin secuencia */
ul ul li {list-style: disk}
ul ul ul li {list-style: circle}
ul ul ul ul li {list-style: disk}
ul ul ul ul ul li {list-style: circle}
|
/* Definir Clases genéricas para cualquier tag:
se definen como <p class="enfasis"> */
.enfasis {
font-weight: bold;
font-size: 10pt;
font-family: verdana, arial, helvetica, sans-serif;
color: black
}
.centrar { text-align: center }
.nodisponible {color: #555555}
.fondogris { background-color: #DDDDDD }
.fondonegro { background-color: #000000 }
.letraroja { color: #C54646 }
.letrablanca { color: #FFFFFF }
|
/* Definir clase para Tag SELECT Menus */
.textoforma1 {
font-family: arial,helvetica, sans-serif;
font-size: 6pt
}
|
/* Definir clase para Tag SELECT Menus */
.textoforma2 {
font-family: verdana, arial, helvetica, sans-serif;
font-size: 9pt;
}
|
-
La primer declaración de este CSS indica que todo el contenido anidado en el elemento <body> (todo el documento en sí) tendrá como color de fondo #FFFFFF (blanco) .
La siguiente sección define que el contenido de los elementos h1, h2, h3, h4, h5, h6, body, a, p, ul, ol, td, th, blockquote, textarea, input, select, form deben tener tipo de letra: arial, helvetica, sans-serif; la lista se debe a que algunos navegadores no contienen ciertos tipos de letra; el primer tipo de letra que tenga disponible el "Browser" será aquella empleada para el despliegue. pre, code deben ser desplegados con el tipo de letra monospace .
p {text-indent: 3em } indica que todo contenido dentro de elementos <p> debe tener una sangría de 3, la longitud em permite que la sangría sea generada de acuerdo al tamaño de letra; posteriormente se define el elemento p.sinsangria {text-indent: 0em} utilizado para evitar sangría, su declaración seria <p class="sinsangria">.
Se define el tamaño de letra para los encabezados h1, h2, h3, h4, h5, h6. Le siguen los tipos de "bullets" que serán utilizados para las diversas listas (Enumeradas y sin enumerar). Finalmente se definen otra serie de clases que pueden ser utilizadas en cualquier tipo de Tag, la utilización de éstas se lleva acabo agregando el atributo class=nombre al Tag en cuestión. Nota: La sintaxis /* indica el inicio de un comentario, y */ su terminación.
|
