HTML    •    CSS

Introducción al HTML.
Estructura básica de una página web.
Meta tags básicos.
Etiqueta body.
Formateo de texto.
Párrafos y saltos de línea.
Comentarios.
Separadores. Etiqueta hr.
Encabezados.
Caracteres especiales.
Tablas.
Listas.
Imágenes.
Mapas de imágenes.
Enlaces.
Formularios I: introducción.
Formularios II: campos de texto.
Formularios III: listas de opciones.
Formularios IV: botones submit y reset.
Formularios V: otros campos.
Formularios VI: ejemplo de formulario.
Frames.
Iframes.
Marquee.
HTML 5
Fieldset y legend.
Más etiquetas.
Idioma
CSS.
Javascript.
Inicio > Curso de HTML > Párrafos y saltos de línea.

Párrafos y saltos de línea.

En este tema vamos a tratar y a explicaros los párrafos y los saltos de línea en html. Porque debemos saber que el html los saltos de línea, es decir, los espacios que hagamos en el código no son interpretados te tal forma.

En html para dejar un salto de línea debemos utilizar una serie de etiquetas, de código, que el navegador interpretará cómo tal. Esas etiquetas son <br/> </p> o </pre>. A continuación te explicaremos cada una de ellas.

Saltos de línea

Ya os hemos comentado anteriormente que en html los saltos de línea escritos en código no son tal una vez el navegador interpreta el código. Vamos a explicaros esto con un claro ejemplo:

Puedes escribir un texto como este
y el navegador no lo interpretará así

Y se verá así: 

Puedes escribir un texto como este y el navegador no lo interpretará así


Existen dos etiquetas para indicar que queremos hacer un salto de línea normal. Son las etiquetas <br> y <br/> ambas son interpretadas igual por el navegador. Esta etiqueta no hace falta abrirla y cerrarla, sólo con escribirla el navegador ya la interpreta.


Así pues el texto anterior deberíamos escribirlo de la siguiente forma:

Puedes escribir un texto como este <br/>
y el navegador no lo interpretará así

Párrafos

Para indicarle al navegador que queremos poner ese texto en un párrafo, debemos escribirlo entre las etiquetas <p> y su cierre </p>.

Así el texto quedará dentro de un párrafo, separado por un espacio en blanco por encima y uno por abajo.

El texto del párrafo lo puedes alinear utilizando la etiqueta align utilizando los parámetros “center” (para alinearlo al centro), “right” (para alinearlo a la derecha), “left” (para alinearlo a la izquierda) y “justify” (para justificar el texto).

Un ejemplo de esta etiqueta con sus respectivos parámetros es el siguiente:

<p align="center">Este texto se alineará al centro</p>
<p align="right">Este texto se alineará a la derecha</p>
<p align="left">Este texto se alineará a la izquierda</p>

que se verá así:

Este texto se alineará al centro

Este texto se alineará a la derecha

Este texto se alineará a la izquierda


La etiqueta <pre>

La etiqueta <pre> la puedes utilizar para que el navegador interprete el texto escrito tal y como está.

Como ejemplo es mostraremos este texto:

Escribo esta línea así


Dejo dos líneas de separación



y escribo tres más.


Sin poner ninguna etiqueta, el navegador respondería así:

“Escribo esta línea así Dejo dos líneas de separación y escribo tres más.”

En cambio utilizando la etiqueta <pre> y cerrándola con su correspondiente etiqueta, el texto se vería como queremos.

<< Formateo de texto. Comentarios. >>

Artículo escrito por Alberto Gómez para HazUnaweb.com. Queda absolutamente prohibida su reproducción.  


© HazUnaWeb.com. Tutoriales y manuales de programación y diseño de páginas web. :: Contacto :: Aviso legal
Queda absolutamente prohibida la copia o reproducción total o parcial de los contenidos de este página.