TUTORIAL HTML: 5. CUERPO DEL DOCUMENTO
La etiqueta <body></body> engloba el contenido principal del documento HTML (textos, imágenes, etc.). Esta etiqueta puede llevar parámetros opcionales relativos al color de fondo del documento y al color del texto y los enlaces. Estos parámetros son:
- bgcolor = Define el color de fondo del documento.
Ejemplo: <body bgcolor=»#000000></body>
- background= Hace referencia al fichero de imagen que servirá como fondo de la página. Si la imagen no rellena todo el fondo del documento, será reproducida en mosaico.
Ejemplo: <body background=»mifoto.jpg»></body>
- text = Define el color para el texto del documento. Por defecto es negro.
Ejemplo:<body text=»red»></body>
- link = Define el color de los enlaces. Por defecto es azul.
Ejemplo: <body alink=»#00FF00″></body>
- vlink = Define el color de los enlaces ya visitados. Por defecto es morado.
Ejemplo: <body vlink=»yellow»></body>
El color puede describirse de dos formas:
- Por medio del nombre del color en inglés (ver cuadro de colores).
- Por medio de una expresión numérica: Consiste en la formación de un código RBG (Red, Green, Blue) compuesto por tres valores hexadecimales que señalan la proporción de cada uno de ellos en el color resultante. Es necesario colocar delante de ellos el símbolo «almohadilla» (#).
Cuadro de colores :
Puedes ver todos los colores en html en: http://html-color-codes.com/
🙂
Ejercicio :
Copia el siguiente código en el editor de textos (te recomiendo que escribas los códigos a mano y no caigas en la tentación de copiar y pegar, pues es la mejor forma a aprender HTML)
<html>
<head><title>Mi página web </title></head>
<body bgcolor=»#000000″ text=»#FFFFFF» link=»#00FF00″ vlink=»#0000FF»>Este es el texto de mi página web </body>
</html>
Guárdalo como «ejercicio_2.html» (recuerda poner la extensión «html», si no se guardará por defecto como text).Ábrelo desde tu navegador y observa la apariencia. Haz los cambios necesarios hasta que adquieras cierta práctica. Prueba a poner cualquier imagen de fondo. Guarda la imagen en la misma carpeta en la que hayas guardado el ejercicio_2.html y añade el siguiente atributo dentro de la etiqueta body:
background=»nombrearchivo.jpg»
Puedes guardar las imágenes en otra carpeta (de hecho es lo recomendable) pero entonces tendrás que tener mucho cuidado al indicar la ruta al navegador.
Prueba el resultado. Verás que la imagen de fondo anula el color de fondo. Como por ahora no hemos colocado ningún link en nuestra página, no podrás ver el efecto. Si quieres, para ir probando, añade lo siguiente a continuación de la palabra web.
<a href=»#»>esto es un link </a>
De modo que quede como sigue:
<html>
<head><title>Mi página web </title></head>
<body bgcolor=»#000000″ text=»#FFFFFF» alink=»#00FF00″ vlink=»#0000FF»>Este es el texto de mi página web. <a href=»#»>esto es un link </a></body>
</html>
Prueba a indicar los colores usando sus nombres en inglés en vez del valor RBG:
<body bgcolor=»blue» alink=»green» vlink=»yellow»>
