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 HTML
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 en HTML
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 os mostraremos este texto:
Escribo esta línea así
Dejo dos líneas de separacióny 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, este código:
<pre>Escribo esta línea así
Dejo dos líneas de separacióny escribo tres más.</pre>
Se vería así:
Escribo esta línea así
Dejo dos líneas de separacióny escribo tres más.
Ruth dice
Claro, fácil y muy bien explicado! Muchas gracias
Hector dice
Buen dia, excelente hermano, me ayudo mucho. Gracias.
Gabriel Lopez dice
Me salvaste la vida en un diseño, gracias.
jessica torres dice
Me parece que esta bien explicado.
Rayna Carmona dice
Funciona perfecto. A mí también me ayudó mucho. Gracias!!
Jesus Castro dice
Excelente explicación
Charles dice
Buena
Santiago Melo dice
Estoy de acuerdo con que está muy bien explicado, pero tengo una duda, cuando dice que genera un espacio en blanco por encima y por abajo, ¿Existe alguna forma de reducir ese espacio en blanco?
BuscoCasita dice
Justo lo que necesitaba, gracias
Dario dice
muy buena la informacion
luz marina diaz dice
Me salvaste la vida mi hermano. no tenia ni idea como hacerlo
Maria Valenzuela dice
Muchas gracias, estudie programación pero desde hace tiempito, hago todo con wordpress y no recordaba el comando html para justificar la letra y centrarla por partes. MIl Gracias un abrazo.
Daniel Vega dice
¡Bendito seas, justo lo que necesitaba ese ¡