El cuerpo del DOM es el que contiene todo el texto e imágenes de la página, que junto a los elementos HTML te dan el control del formato.
Antiguamente NO TODOS estos elementos eran soportados por todos los navegadores (Browsers) y eso depende de la versión de HTML que manejen (Ej 1, 2, 3, 3.2, 4, 5 o 5.2) incluso Netscape y Explorer estaban creando
cada uno sus propias especificaciones.
A partir de HTML5 esto ya no ocurre porque ahora las recomendaciones
van delante incluso de los desarrolladores de los navegadores.
Todos los efectos requeridos en la pagina web, debe ser necesariamente especifican exclusivamente a través de las etiquetas. Es decir los espacios, tabulaciones y retornos de carro que metas en el archivo fuente no tienen ningún efecto a la hora de la presentación final del documento. Por ejemplo, escribiendo:
Todas estas
palabras
forman una frase.
Obtendremos exactamente lo mismo que con:
Todas estas palabras forman una frase.
En resumen, la estructura básica de un documento HTML es:
Es importante tener en cuenta, que al presentar el documento el navegador cliente hará caso omiso de los espacios, tabulaciones y retornos de carro que se encuentren en el texto fuente.
<!DOCTYPE html> <HTML lang='es'> <HEAD> <Meta CharSet='UTF-8' /> <TITLE>Título</TITLE> </HEAD> <BODY> Texto del documento, etiqueta de formateo, enlaces, imágenes, sonido, video, aplicaciones en JAVA, JavaScript, VBScript, ActiveX, CGI's, PHP... </BODY> </HTML>
A partir de HTML5 ya no se debería usar estos atributos de BODY. Sin embargo los mencionaremos aquí porque en realidad aunque ya no se recomiendo usarlos siguen funcionando en los navegadores.
| Atributo | Descripción |
|---|---|
| TEXT | Especifica el color del texto en todo el documento |
| BGCOLOR | Especifica el color del fondo |
| BACKGROUND | Especifica una imagen de fondo. |
| MARGIN | Especifica los margenes del documento. |
| LINK | Color de enlaces no visitados |
| ALINK | Color de enlaces activos |
| VLINK | Color de enlaces visitados |
Usar estilos en cascada CSS.
Parámetro usado para especificar el color del fondo sin imagen. #rrggbb representa la trica RGB (Red-Green-Blue) en hexadecimal. color representa uno de los 156 colores de la paleta extendida. Por default el texto es negro sobre fondo gris.
<Body BGCOLOR=#rrggbb> o <Body BGCOLOR=color>
Una buena ayuda para la selección de colores con #rrggbb la puedes encontrar en: Paleta de Colores
Text parámetro usado para definir el color del texto por omisión. Su formato es el mismo que el de BGCOLOR. Por default es negro.
Link, Vlink, y Alink parámetros usados para especificar el color por omisión de: texto con enlace, enlace ya visitado y enlace activo.
Los colores por omisión son LINK=blue, VLINK=purple y ALINK=red. El formato es el mismo que BGCOLOR.
Parámetro usado para especificar la ruta y nombre de archivo (URL) de la imagen que será usada como fondo del documento, que será mostrada, dependiendo de su tamaño como mosaico para cubrir toda la ventana, como el papel tapiz en Windows.
<BODY BACKGROUND=ruta/archivo.gif>
Para mas información consulta la etiqueta BACKGROUND en este mismo manual.
Si en el navegador del cliente la opción de "Auto Load Images" esta off, no podrás cargar la imagen de fondo y todos los atributos de color de texto como: TEXT, BGCOLOR, LINK, ALINK y VLINK son ignorados, dejando el fondo gris y texto negro. :-(
LEFTMARGIN y TOPMARGIN: Margen izquierdo y superior del documento en pixels.
<BODY LEFTMARGIN=60> o <BODY TOPMARGIN=60>
HTML no puede manejar eventos es por eso que para estas tareas usamos JavaScript.
<!DOCTYPE html>
<Html lang='es-PE'>
<HEAD>
<Meta CharSet='UTF-8' />
<TITLE>Usuario esta en linea o no ?</TITLE>
<Script>
function xyz(online){
document.getElementById('status').textContent = online ? 'Online' : 'Offline';
}
</Script>
</HEAD>
<BODY Online="xyz(true)" Offline="xyz(false)" Online="xyz(navigator.onLine)">
<P>Ud esta: <SPAM ID=status>(Desconocido)</SPAN></P>
...
</BODY>
</HTML>
Ejemplo 2
<BODY OnLoad=funcion()>
Ejemplo 3
<BODY OnPageShow=funcion()>
Para mas detalle consulta Apuntes JS.
Cada elemento de color en BODY solo puede ser especificado una sola vez para todo el documento, no puede ser cambiado para parte del documento. Para cambiar el color de un texto en particular te recomiendo usar CSS.
Al especificar una imagen como fondo, se requiere que dicha imagen sea cargada completamente, esto reduce la velocidad de carga del documento y ninguna parte podrá ser mostrada hasta que la imagen termina de ser cargada y decodificada. Por lo que es muy importante que las imágenes de fondo sean pequeñas y simples. Por defecto esta imagen de fondo es repetida hasta llenar toda la pantalla (como mosaico).
Otro aspecto a tener en cuenta cuando usas imágenes de fondo es el contraste entre el fondo y el color del texto de manera que aún sea posible leer sin mayor dificultad.
Las recomendaciones HTML5, hacen referencia a ya no usar ninguno de estos atributos de BODY y en su lugar usar estilos CSS. Consulta la pagina sobre estilos CSS para saber mas de ello.