estilos

¿QUE SON LOS ESTILOS?

La forma en que se ven todos los elementos de nuestra página web depende del estilo.
El estilo se compone de distintas propiedades y sus valores correspondientes. Las propiedades pueden ser el color de la fuente, el tamaño, la alineación, los márgenes, etc. Los valores dependen de cada propiedad, por ejemplo, a la propiedad color le podemos asignar valorescomo red (rojo), blue (azul) y a la propiedad tamaño fuente le podemos asignar un valor en porcentaje 100%,120% o en pixeles 12px, 15px.
Las hojas de estilo resuelven estos problemas al mismo tiempo que reemplazan al limitado rango de mecanismos de presentación del HTML. Con las hojas de estilo es más fácil especificar la cantidad de espacio entre líneas, el sangrado de las líneas, los colores a utilizar parael texto y el fondo, el tamaño y estilo de las fuentes, y otros muchos detalles.
El formato a seguir para definir una propiedad es: propiedad: valor; o  propiedad: valor1 valor2 valor3; si puede tener varios valores.
Por ejemplo, si queremos que el texto sea de color rojo y un tamaño de fuente de 120%, escribiríamos el siguiente estilo:
color:red; font-size:120%
Y obtendríamos el siguienteresultado:
Texto rojo a 120%

¿Dónde escribimos el estilo? Hay varias formas de hacerlo, como vamos a ir viendo a lo largo del curso, pero lo más recomendable es agrupar todas las declaraciones de estilos en un solo lugar, definiendo un bloque dentro de la etiqueta Head que contega la definición de estilos. Para ello, tenemos que incluir en la etiqueta  ...  y definir dentro los estiloscorrespondientes a cada elemento de nuestra página, como puedes ver al principio de esta página.


ESTILOS
FUENTES
Familia de fuentes [font-family]
La propiedad font-family  se usa para establecer una lista ordenada de fuentes que se usarán para mostrar un elemento determinado o una página web. Si la primera fuente de la lista no está instalada en el ordenador desde el que se accede al sitio, seseguirá probando con la siguiente fuente hasta encontrar una fuente apropiada.
Para clasificar las fuentes se usan dos tipos de nombres: nombres de una familia y familias genéricas. Estos dos términos se explican a continuación.

Al listar fuentes para el sitio web, por supuesto se empieza por la preferida, seguida ésta de algunas fuentes alternativas. Se recomienda completar la lista con unafamilia de fuentes genérica. Así, al menos, la página se mostrará usando una fuente de la misma familia si ninguna de las especificadas están disponibles.
Un ejemplo de lista de fuentes por orden de prioridad podría tener este aspecto:
Los encabezados marcados con la etiqueta  se mostrarán usando la fuente "Arial". Si esta fuente no está instalada en el ordenador de usuario, se usará en su lugar lafuente "Verdana". Si ambas fuentes no están disponibles, se usará una fuente de la familia sans-serif para mostrar los encabezados.
Fíjate cómo el nombre de fuente "Times New Roman" contiene espacios y, por lo tanto, se lista usando comillas.
Estilo de la fuente [font-style]
La propiedad font-style define la fuente elegida bien con el valor normal, el valoritalic o el valor oblique. En el ejemploque sigue, todos los encabezados marcados con  aparecerán en cursiva.

Variante de fuente [font-variant]
La propiedad font-variant se usa para elegir entre las variantes normal o small-caps (versalita) de una fuente. La fuente a la que se aplica el valorsmall-caps es una fuente que usa letras en mayúscula inicial más pequeñas, en vez de letras en minúscula. ¿Confuso? Veamos los ejemplossiguientes:

Si la propiedad font-variant se establece con el valor small-caps y no hay disponible una fuente en versalita, el navegador probablemente mostrará el texto en mayúscula.


Peso de la fuente [font-weight]
La propiedad font-weight describe qué intensidad o "peso" en negrita debería tener la fuente. Toda fuente puede tener los valores normal o bold. Algunos navegadores soportan,...