Escribir Texto

[Anterior] [Siguiente] [Contenido]

Contenido del Capítulo:

[Arriba]

Introducir texto

Ya hemos visto en el ejemplo anterior cómo escribir texto en una página, basta con escribirlo dentro de las etiquetas <body>. Sin embargo el HTML tiene una peculiaridad, no muestra el texto tal y como lo escribimos. Para comprobarlo veamos un ejemplo:

<html>
<head>
<title>Tu primera página</title>
</head>
<body>

Hola, me llamo PON TU NOMBRE.


Esta es mi primera página web.
HTML es una cosa muy fácil.

</body>
</html>

Es lógico pensar que la página tendrá este aspecto:

Hola, me llamo PON TU NOMBRE.


Esta es mi primera página web.
HTML es muy fácil.

Sin embargo este es el aspecto real: ejemplo2.html

Saltos de línea

Como ves nos escribe todas las líneas seguidas, no pone saltos de línea. Tenemos que ponerlos nosotros. La forma de saltar a la línea siguiente es usando la etiqueta <br>. Esta es una de las pocas etiquetas que no tiene pareja, no existe una etiqueta </br>.

<html>
<head>
<title>Tu primera página</title>
</head>
<body>

Hola, me llamo PON TU NOMBRE.<br>
Esta es mi primera página web.<br>
HTML es una cosa muy fácil.<br>

</body>
</html>

Comprueba cómo efectivamente ahora funciona: ejemplo3.html

Podemos poner todos los saltos que queramos entre líneas, cada <br> hace que saltemos a la línea siguiente.

Espacios

Vamos a hacer una segunda prueba, creamos una página con un montón de espacios entre algunas palabras:

<html>
<head>
<title>Tu primera página</title>
</head>
<body>

Hola,                    me llamo PON TU NOMBRE.<br>
Esta es mi primera                     página web.<br>
HTML es                   una cosa muy fácil.<br>

</body>
</html>

Seguramente esperarás que tenga este aspecto:

Hola,                    me llamo PON TU NOMBRE.
Esta es mi primera                     página web.
HTML es                   una cosa muy fácil.

Pero no es así, los espacios adicionales se eliminan y tan sólo se deja un espacio entre dos palabras. Compruébalo en este ejemplo: ejemplo4.html.

Entonces ¿cómo metemos espacios adicionales? Existen en HTML lo que se llaman códigos, cada código representa una letra o un carácter. Por ejemplo el código del espacio en blanco es &nbsp; (Non Breaking SPace). Si escribimos &nbsp; obtendremos un espacio adicional:

<html>
<head>
<title>Tu primera página</title>
</head>
<body>

Hola,            me llamo PON TU NOMBRE.<br>

</body>
</html>

Compruébalo aquí: ejemplo5.html

Texto sin formatear

Existe una forma de mostrar el texto con saltos de línea y espacios sin tener que usar <br> y &nbsp;. Es el texto preformateado. Cuando ponemos texto en una página el navegador lo formatea, le quita los saltos de línea y los espacios adicionales. Podemos indicarle que no haga esto usando las etiquetas <pre> y </pre>. Cuando rodeamos un texto con estas etiquetas queda preformateado, es decir, queda tal cual:

<html>
<head>
<title>Tu primera página</title>
</head>
<body>

<pre>
Hola,                    me llamo PON TU NOMBRE.
Esta es mi primera                     página web.
HTML es                   una cosa muy fácil.
</pre>

</body>
</html>

Este texto queda:

Hola,                    me llamo PON TU NOMBRE.
Esta es mi primera                     página web.
HTML es                   una cosa muy fácil.

[Arriba]

Párrafos

Una forma más ordenada de introducir el texto es utilizando <p> y <p>. Todo lo que va entre estas dos etiquetas es un párrafo. Probablemente verás muchas páginas que utilizan sólo la primera etiqueta (<p>), esto es válido pero se recomienda usar ambas.

La forma correcta de usar lo párrafos es colocando <p> al principio del párrafo y </p> al final.


Actualizada el día: 9 de Marzo de 2000

© Gorka Urrutia, 1999, 2000

gorkau@oocities.com
Gorka's Web Page