Clases de CSS (III) – "body" que mas ponerle.

Redes La ultima vez utilizamos la etiqueta BODY y colocamos el siguiente código para el formateo de la etiqueta, hoy analizaremos cada una de las características de este etiqueta:

body {
background:#D21034 repeat;
margin:0;padding:0;
color:#FFFFFF;
font:11px verdana,arial,sans-serif;
line-height:1.4;
text-align:left; }

Estas son la principales características de esta etiqueta, aunque en realidad cuanta con 54 características de formato ( son las que yo he encontrado ) trataremos de ver las principales y mas importantes ( según yo ) empecemos

background

background cuenta con 5 características para formatear:

background-color: que te permite asignarle un color de fondo a tu body por ejemplo : background:#D21034;.

background-image: que te permite determinar una imagen como parte de tu fondo por ejemplo: background: #D21034 url(blogger.gif);.

background-image: esta característica te permite asignarle a la imagen una repetición y cuanta con 4 opciones distintas:

repeat-x (repetición en el eje x, horizontal),
repeat-y(repetición en el eje y, vertical),
no-repeat (no repetir, solo 1 imagen),
repeat (toda la pagina llena de imágenes);

ejemplo: background: #D21034 url(blogger.gif) repeat;.

background-atachment: esta característica te permite a la imagen que se coloco de fondo darle dos características:

scroll (al momento de desplazarse por la pagina se desplaza también),
fixed (permanece fijo si se desplaza por la pagina),

ejemplo: background: #D21034 url(blogger.gif) repeat fixed;.

background-position: esta característica te permite alinear la imagen de fondo en base a la pagina en 5 distintas posiciones:

top (arriba),
center (centro),
bottom (abajo),
left (izquierda),
right (derecha),

es decir se va a alinear la repetición hacia la opción elegida, así también la repetición.
ejemplo: background: #D21034 url(blogger.gif) repeat fixed center;.

color

Esta característica te permite darle un color predeterminado a todo el texto que se ingrese a la pagina. ejemplo: color: Black; o color: #4682B4;.

Font

Esta característica te permite darle un tipo de fuente predeterminado para todo el texto que se ingrese a la pagina y cuanta con varias características que se pueden modificar:

font-style: puede seleccionar entre los distintos tipos de estilos del texto:

normal – ejemplo: font: normal;.
italic – ejemplo: font: italic;.
oblique – ejemplo: font: oblique;.

font-variant: permite seleccionar como se presentara la fuente de nuestra pagina tiene 2 opciones:

small-caps: la fuente en minúsculas aparece en mayúsculas y pone en capital la que es mayúsculas. ejemplo: font: normal small-caps;.
normal: la fuente aparece como normalmente la veríamos mayúsculas minúsculas. ejemplo: font: normal normal;.

font-size: determina el tamaño de la fuente que se va a utilizar en la pagina, se puede determinar en % o PX. ejemplo: font: normal normal lighter 111%; o font: normal normal lighter 11px;.

font-family: determina que fuente es la que se usara para la pagina. ejemplo: font: normal normal lighter 11px verdana,arial,sans-serif;.

margin

Esta característica te permite darle los margenes a la pagina en donde iniciara el texto de nuestra pagina, se proporciona el % o cantidad en PX que se desea. ejemplo margin: 6px 6px 6px 6px;.

text-align

Esta característica te permite darle una alineación predeterminada a todo el texto, y recibe como parametros los siguientes: left, right, center, justify (si el navegador lo soporta)
ejemplo: text-align: left;.

border

Esta característica te permite darle un borde a toda la pagina y tiene como parámetros lo siguiente:

border-width: determina el grosor del borde y se le puede suministrar

thin – ejemplo: border: thin;.
medium -ejemplo: border: medium;.
thick -ejemplo: border: thick;.

border-style: selecciona un estilo para el borde y puede seleccionar entre:

dotted – ejemplo: border: medium dotted;.
dashed – ejemplo: border: medium dashed;.
solid – ejemplo: border: medium solid;.
double – ejemplo: border: medium double;.
groove – ejemplo: border: medium groove;.
ridge – ejemplo: border: medium ridge;.
inset – ejemplo: border: medium inset;.
outset – ejemplo: border: medium outset;.

color: selecciona el color de el borde, ejemplo: border: medium outset #6B8E23;.