hojas de estilos


Escribiendo hojas de estilo
Elementos modificables con CSS
O mejor dicho, atributos de elementos que pueden modificarse con CSS. Son muchos (casi todos) los aspectos que pueden modificarse con CSS. Dado el carácter general de esta guía, aquí veremos solamente los más utilizados.
Generalmente se actúa sobre los siguientes:
Texto o contenido
Tamaño del bloque
Color del fondo del bloqueBordes de bloque
Estilo de los bordes
Color de los bordes
Márgenes de bloque
Espaciado interno del bloque
Posicionamiento del bloque
Gráficos y bloques flotantes
Visibilidad del bloque
Listas
Enlaces
CSS + JavaScript
Efectos especiales
Tablas
Y puede que te preguntes qué es un bloque. Como bloque puede entenderse todo lo comprendido dentro de elementos con cierre, como , ,   , , ,, etc., y al aplicar estilos con CSS no es buena idea escribir nada fuera de estos elementos. En lugar de ser un nombre de elemento HTML, un bloque también puede tener un nombre definido por el programador, por ejemplo "menu", y generalmente son éstos los que contienen en su interior a los anteriores o a otros bloques definidos por el usuario. El número de bloques en una página puede ser muyelevado (más de mil), y dependerá de la capacidad del navegador utilizado.
Veamos cómo funciona cada cosa:
Los Márgenes de bloque son el espacio comprendido entre el bloque y el borde de la ventana activa del navegador. Se controla con el atributo margin.
Los Bordes de bloque, sin aplicar estilos, no son visibles, y es como un cuadro imaginario que envuelve todo el contenido del bloque. Su atributode control es border.
Espaciado interno del bloque es la distancia entre el borde del bloque y su contenido. Es el atributo padding (en inglés significa algo así como "acolchado")
El Estilo y color de los bordes, son evidentes: son las líneas que delimitan el bloque, que pueden dibujarse de varias formas en cuanto a tipo de trazo, grosor y color. Estos dos atributos también pueden actuar sobrelos bordes de otros elementos contenidos dentro de un bloque, como formularios, tablas, gráficos, etc.
El Color del fondo se controla con las mismas instrucciones que las de la página HTML: background. Los parámetros de color, al igual que en HTML, se pueden escribir con su nombre (en inglés) o con la notación RGB en hexadecimal.
El Tamaño son las dimensiones del bloque. Si no se indicandimensiones, por defecto, el bloque ocupará todo el ancho de la ventana, y de alto lo que su contenido precise. Se utilizan dos atributos para controlarlo: width para el ancho y height para el alto.

Estilo del texto
Veamos los parámetros disponibles para dar estilo al texto. Como ya sabes, las unidades de medida aplicables a todos ellos son varias, pero para mayor claridad, en todos los ejemplosutilizaremos solamente el píxel: px. Sea por ejemplo la siguiente página:


Estilos




Texto fuera de párrafo.
Segunda línea fuera de párrafo.

texto de párrafo. segunda línea de párrafo.




Y si escribimos la siguiente hoja de estilo estilo.css:
BODY {color:green }

P {color:red;
font-size:20px;
font-family:Courier;
font-weight:bold;
font-style:italic;line-height:30px;
letter-spacing:5px;
text-decoration:underline;
text-transform:capitalize;
text-align:left;
text-indent:30px;
}
Se obtiene:
Texto fuera de párrafo.
Segunda línea fuera de párrafo.
Texto De Párrafo. 
Segunda Línea De Párrafo
Fíjate en la gran diferencia de estilo que hay entre las dos primeras líneas y las dos siguientes. Analicemos cómo funciona: Las dosprimeras líneas de texto, en color verde, tienen todos sus valores por defecto, excepto el color que lo reciben de la etiqueta BODY definida en la css. Las dos siguientes, en rojo, reciben todas sus características de la etiqueta P, también definida en la css. Como puedes ver, hay una gran cantidad de atributos que actúan sobre el estilo de ese texto.
color:red;    Este ya lo conocemos. Define el...