Códigos HTML para espacios en blanco y saltos de línea

Dentro de la vocación de servicio público con la que se creó este blog he pensado que ahora que muchos estáis de vacaciones es un buen momento para repasar algunos conceptos de HTML (ya sabéis, el lenguaje con el que se escriben las páginas web). Hoy veremos los códigos HTML para espacios en blanco y saltos de línea.

En el lenguaje HTML se consideran espacios en blanco los espacios entre palabras, el tabulador, el retorno de carro y el salto de línea.

Por defecto, el HTML ignora los espacios en blanco “sobrantes”, que en este caso son todos los que no son el espacio en blanco que separa las palabras. Para que lo entiendas, te pongo un ejemplo. Si escribes en HTML este texto:

Hola,

me llamo

Felix Salguero

En la web se verá así:

Hola, me llamo Felix Salguero

Porque el HTML no reconoce esos saltos de línea. Para que lo haga es necesario usar alguna de las siguientes etiquetas:

La etiqueta <br> es una etiqueta vacía, es decir, no hace falta poner una etiqueta de apertura y otra de cierre. El equivalente a esta etiqueta es pulsar el Intro (o Enter) al estar escribiendo, se inserta un salto de línea.

De este modo, el texto anterior quedaría como:

Hola, <br>

me llamo <br>

Felix Salguero

Otra forma de meter saltos de línea, quizás más elegante, es encerrar el párrafo entre las etiquetas <p> y </p>. Tendríamos algo así:

<p>Este es un ejemplo de párrafo que usa la etiqueta que acabamos de presentar.</p>

<p>Este párrafo quedaría separado del anterior por un salto de linea.</p>

Pero, ¿qué pasa cuando quieres meter espacios adicionales entre palabras dentro de una misma línea? Por ejemplo, poner algo como esto:

Hola,   me   llamo   Felix Salguero

Pues para eso también hay un código especial: &nbsp;

Este código equivale a un solo espacio en blanco. Empleando este fragmento de código, la frase anterior quedaría como:

</p>.

Hola, &nbsp; &nbsp; &nbsp; me &nbsp; &nbsp; &nbsp; llamo &nbsp; &nbsp; &nbsp; Felix &nbsp; &nbsp; &nbsp; Salguero.

En otras ocasiones puede ser cansado maquetar un texto en HTML y quieres que el texto que introduces en la web mantenga el formato de espacios en blanco con el que lo has escrito. Para eso están las etiquetas <pre> y </pre>.

Solo tienes que introducir el texto entre esas dos etiquetas parra que el formato se respete. Ejemplo:

<pre>

Hola,

me llamo

Felix                 Salguero

</pre>

Espero que conocer los códigos HTML para espacios en blanco y saltos de línea te sirvan de ayuda.