¿Cómo se crea un Párrafo?

Los Párrafos son muy importantes porque es la estructura básica en cualquier texto y no es la excepción un archivo HTML. Cuando la información se divide en

Párrafos

Es muy probable que sea el Elemento que más utilices en la construcción de un archivo HTML.

Notarás que muchos Elementos comparten algunos Atributos, Propiedades y Valores, lo que hará que algunos temas sean percibidos como redundantes. El objetivo de dividir los tutoriales es que cada tema sea de consulta donde puedas acceder y ver cómo se utiliza y comprender con la práctica el uso de cada Elemento.

Para crear un Párrafo, lo realizaremos de la siguiente manera:

        <p>Contenido</p>
        

El Elemento Párrafo permite encapsular lo que está entre sus etiquetas.

Gracias a éste método, se crea un salto de línea automática. Si no tubiera éstas etiquetas tendríamos un texto interminable.

Si no pones tu contenido entre las Etiquetas del Elemento Párrafo, tenemos que utilizar un Elemento Vacío que crea un salto de línea.

Elemento Salto de Línea

La etiqueta de Salto de Línea es:

<br>

Se utilizaría de la siguiente manera:

        Elemento html
        <br>
        Elemento html
        

Se visualizará en nuestra web de la siguiente manera:

        contenido
        

        contenido
        

Con br podemos sustituir el uso del Elemento Párrafo.

Se recomienda combinar el uso del Elemento Párrafo y utilizar el elemento de Salto de Línea para formatos específicos.

Sin embargo, saber el uso de ambos elementos, nos da más herramientas para la creación de nuestra web.

¿Cómo podemos cambiar el color del Elemento Párrafo?

Para cambiar el Color del texto en la Etiqueta de Inicio del Elemento Párrafo, tenemos que utilizar un Atributo llamado Color.

El Atributo Color nos permite darle Valores RGB, HEX o HLS para asignarle un color al contenido.

La sintaxis quedaría de la siguiente manera:

        <p style="color:red;">Contenido</p>
        

Para éste ejercicio utilizaremos el Atributo style que es una Propiedad CSS.

El Atributo style va a tomar lo que la Propiedad Color le dé, y para ello, dependerá del Valor que le demos a la Propiedad Color.

Utilizaremos los Tres tipos de Valores que le podemos dar a las Propiedad color: RGB, HEX y HLS.

No te preocupes por el momento de qué es RGB, HEX o HSL. Eso lo veremos en Colores en HTML. Veamos los ejemplos para que lo puedas realizar.

Color con nombres pre-establecidos

Vamos a utilizar el ejemplo anterior, aprovechando que usa Nombre de Color Pre-Establecido:

        <p style="color:red;">Contenido</p>
        

Un Párrafo Normal se vería:

Contenido

Un Párrafo con el Atributo style, la Propiedad color y el Valor red:

Contenido

Color con RGB

Si queremos utilizar RGB la línea es diferente porque el Valor aunque es lo mismo que red, en RGB cambia como en la siguiente línea:

        <p style="color:rgb(255,0,0);">Contenido</p>
        

Un Párrafo Normal se vería:

Contenido

Un Párrafo con el Atributo style, la Propiedad color y el Valor rgb(255,0,0):

Contenido

Color con HEX

Si queremos utilizar HEX la línea es diferente porque el Valor aunque es lo mismo que red, en HEX cambia como en la siguiente línea:

        <p style="color:#ff0000;">Contenido</p>
        

Un Párrafo Normal se vería:

Contenido

Un Párrafo con el Atributo style, la Propiedad color y el Valor #ff0000:

Contenido

Color con HSL

Si queremos utilizar HSL la línea es diferente porque el Valor aunque es lo mismo que red, en HSL cambia como en la siguiente línea:

        <p style="color:hsl(0,100%,50%);">Contenido</p>
        

Un Párrafo Normal se vería:

Contenido

Un Párrafo con el Atributo style, la Propiedad color y el Valor hsl(0,100%,50%):

Contenido

No es todolo que podemos hacer con el Elemento Párrafo pero sí es lo que más se utiliza. El tema de hoy no nos permite ver detalles del Atributo style por el momento copia y pega para que veas los resultados pero si no funciona, quizá sea un punto y coma (;) lo que haga falta.