El cuerpo de un documento HTML contiene todo aquello que será mostrado por pantalla con un navegador. En general, el cuerpo de un documento HTML se indica con el elemento ‘body‘, pero este puede ser reemplazado por el elemento ‘frameset‘ en documentos con marcos. De momento nos centraremos en documentos HTML sin marcos, ya que hoy en día es una práctica poco recomendable en páginas web.
Elementos de bloque y elementos de línea
En el cuerpo de un documento HTML, los elementos pueden ser de dos tipos en función de cómo se formatean: de bloque o de línea.
Los elementos de bloque generalmente comienzan una nueva línea mientras que los de línea no. Los elementos de bloque pueden contener otros elementos de bloque y también de línea mientras que, por regla general, los elementos de línea sólo pueden contener texto y otros elementos de línea.
Elementos de bloque son por ejemplo: ‘h1’, ‘p’, ‘div’, ‘pre’, etc. mientras que elementos de línea son, entre otros, ‘b’, ‘a’, ‘acronym’, ‘span’, etc. Aún no hemos visto en qué consisten todos ellos, pero los veremos detalladamente más adelante.
Los elementos ‘div’ y ‘span’
Los elementos ‘div‘ y ‘span‘ sirven para definir su contenido como "de bloque" (elemento div) o como "de línea" (elemento span). Estos dos elementos no tienen ningún otro significado pero adquieren una gran importancia cuando se combinan con información de estilos CSS, tal y como veremos en próximos artículos.
Los atributos ‘class’ e ‘id’
Estos dos atributos pueden ir asociados a cualquier etiqueta del ‘body‘ y sirven básicamente para identificar elementos.
Con el atributo ‘id‘ podemos asignar un nombre a cada elemento. El nombre debe ser único, por lo que no puede repetirse dentro del mismo documeto. Es muy útil para hacer referencias a un elemento particular desde un script (en JavaScript por ejemplo).
<p id="texto">Esto es un texto de prueba</p>
Con el atributo ‘class‘ se le puede asignar a cada elemento un nombre de clase. Este nombre no tiene por qué ser único y puede repetirse cualquier número de veces en cada elemento de la misma clase. El atributo ‘class‘ es muy útil para aplicar estilos comunes a un grupo de elementos.
<p>Esto es un texto de <span class="cursiva">prueba</span>.</p>
De momento no usaremos demasiado estos atributos ya que un documento HTML simple no necesita de su aplicación a ninguna etiqueta. Sí que volveremos a verlos cuando aprendamos a utilizar hojas de estilo CSS para conseguir documentos más limpios, o cuando aprendamos a introducir scripts en JavaScript para conseguir mayor interactividad del cliente.