Formato de párrafos en HTML

Formatear un texto pasa por tareas tan evidentes como definir los párrafos, justificarlos, introducir viñetas, numeraciones o bien poner en negrita,etc.

Hemos visto que para definir los párrafos nos servimos de la etiqueta <p> que introduce un salto y deja una línea en blanco antes de continuar con el resto del documento.

Podemos usar también la etiqueta <br>, de la cual no existe un cierre, para realizar un simple retorno de carro, con lo que no dejamos una línea en blanco, sino que solo cambiamos de línea.

NOTA: existen otras etiquetas que no tienen su correspondiente cierre, como <img> para las imágenes, como veremos mas adelante. Esto ocurre porque un salto de línea o una imagen no empiezan y acaban más adelante, sino que solo tienen presencia en un lugar puntual.

Los párrafos delimitados por etiquetas <p> pueden ser fácilmente justificados a la izquierda, centro o derecha. Especificando dicha justificación en el interior de la etiqueta por medio de un atributo “align”. Un atributo no es más que un parámetro incluido en el interior de la etiqueta que ayuda a definir el funcionamiento de la etiqueta de una forma más personalizada.

El HTML se usa para definir contenido, por tanto, los atributo “align” que vamos a ver a continuación se están metiendo en una parcela que no le corresponde al HTML, porque está definiendo la forma con la que un párrafo debe de representarse, su estilo y no el contenido. Es importante señalarlo para que aprendas que estas cosas se deben hacer mediante el lenguaje CSS, que sirve para definir el estilo, la forma.

Como veis, en cada caso el atributo “align” tomas determinados valores que son escritos entre comillas. En algunas ocasiones necesitamos especificar algunos atributos para el correcto funcionamiento de la etiqueta. En otros casos, el propio navegador toma un valor definido por defecto. Para el caso de “align” el valor por defecto es “left”.

NOTA: los tributos tienen sus valores indicados entre comillas, pero si no lo indicamos entre comillas también funcionara en la mayoría de los casos. Sin embargo, es aconsejable que pongamos siempre las comillas para acostumbrarnos a utilizarlas, por dar homogeneidad a nuestro código y para evitar errores futuros en sistemas más quisquillosos.

El atributo “align” no es exclusivo de la etiqueta <p>. Otras etiquetas muy comunes, que veremos más adelante, entre las cuales se introduce textos o imágenes, suelen hacer uso de este atributo de una forma habitual.

Imaginemos un texto relativamente largo donde todos los párrafos están alineados a la izquierda. Una forma de simplificar nuestro código y de evitar introducir continuamente el atributo “align” sobre cada una de nuestras etiquetas es utilizando la etiqueta <div>.

Esta etiqueta, <div>, por sí sola no vale para nada, salvo producir un salto de línea simple. Para que realmente se vea tiene que estar acompañada de algún estilo definido en el CSS o del atributo en HTML como “align” y lo que nos permite es alinear cualquier elementó (párrafo o imagen) de la manera que nosotros deseemos.

NOTA: recuerda que “align” tampoco sería correcto de usar en una etiqueta <div>, por el mismo motivo que no sería correcto de usar en un párrafo. Nos sirve para conocer facetas del HTML, que antes se usaban más y nos han quedado heredadas en las versiones actuales del lenguaje.

Como hemos visto, la etiqueta <div> marca divisiones en las que definimos un bloque de contenido y a los que podríamos aplicar estilo de manera global, aunque lo correcto sería aplicar ese estilo del lado del CSS .

Ejercicio-1

ejercicio3

Ejercicio-2

ejercicio4

Ejercicio-3

ejercicio5