Etiquetas HTML de texto - Programación HTML

Antes de conocer las etiquetas HTML de texto, primero comencemos por los conceptos básicos para poder entender mejor.

Tabla de Contenidos

¿Qué es una etiqueta?

Es una palabra o varias palabras que van entre los signos menor y mayor, “< >“. Estas etiquetas indican a nuestro navegador la forma de representar algunos elementos que están dentro de nuestra página web.

Todas las etiquetas HTML de texto contienen una palabra clave que es la que reconoce el navegador y a su vez cada etiqueta posee una serie de atributos que indican la forma en la que se realizarán cada acción.
La sintaxis es como sigue:

<Comando atributo1= “Valor1” atributo2= “Valor2“> TEXTO </Comando>

La gran mayoría de comandos necesariamente tienen un comando inicial y un comando final que incluye “/” entre el signo menor y antes del nombre del comando.
Ejemplo:

<H2> Título del Documento </H2>

Tipos de Comando

Existen 2 tipos de comandos: abiertas y cerradas. Los comandos abiertos utilizan la etiqueta clave al inicio. Ejemplo: <HR> y <BR>

Los comandos cerrados utilizan la etiqueta clave al inicio y final. Ejemplo: <Body>…………………..</Body>

Atributos de un Comando

Son instrucciones que acompañan a un comando y que permite establecer la forma en que afectará al texto, a la imagen, etc.

Por ejemplo, el comando <BODY> que viene hacer el cuerpo de la página web, es decir, donde comenzaremos a diseñar la estructura de nuestra web, tiene varios atributos que abarca desde color de fondo a estilos del texto de la página web.

Insertar Título en HTML

El contenido del blog, es uno de los más importantes, esto tiene que contarnos con claridad y facilidad lo que el autor nos quiere decir.

Etiquetas para insertar Título

<h1>— eqtiqueta principal para crear un título
<h2> y <h3>— etiquetas para subtítulos, por lo general el tamaño del texto disminuye.

Ejemplo de cómo se verían los textos en las diferentes etiquetas de Título:

H2

H3

H4

H5

Insertar Párrafos en HTML

Para separar bloques de texto en un documento html se emplean algunos comandos como bloques especiales, citas y la etiqueta de párrafo <p>

Etiqueta <P>

Se utiliza para separar párrafos. Indica el principio y fin de un párrafo, este comando es necesario aplicar en html, ya que todo el texto es continuo. Se representa de la siguiente forma: <p> …. </p>

Atributos de la etiqueta Párrafo

Alinear Parrafos html

align = atributo para alinear texto: center, left, right

<p align =”center”> TEXTO </p>

Negrita a un texto en html

<b>— esta etiqueta nos permite dar negrita al texto

<b> TEXTO </b>

Cursiva a un texto en html

<i>— esta etiqueta permite dar cursiva al texto

<i>TEXTO</i>

Subrayado a un texto en html

<u>— esta etiqueta permite subrayar texto

<u>TEXTO</u>

Tamaño, fuente y color de texto html

<font>— esta etiqueta nos permite dar color, tamaño y tipo de fuente al texto.

<font color=”blue” face=”Comic Sans MS, arial” size=4> texto </font>

Ejemplo:

<html> 
<head> 
<title>Receta de cocina</title> 
</head>
 <body> 
<font color="Olive" face="Comic Sans MS,arial"> 
<h2 align="center"><i>Cocina Peruana</i></h2> 
<h3 align="center">Cocina Limeña</h3> 
</font> 
<font face="Comic Sans MS,arial"> Descubre los platos más deliciosos, fáciles 
y económicos que puedas imaginar. <br>
En este sitio web tendrás acceso a una gran diversidad 
de <b>recetas</b> de preparación fácil, aprenderás 
a cocinar <b>platos típicos Peruanos</b> 
dentro de una variedad de recetas que encontrarás aquí en nuestro 
<b>blog</b> gourmet donde nuestro chef virtual podrá ayudarte con tus 
recetas de comida. Podrás adquirir <b>libros</b> gastronómicos más 
populares de las comidas populares y exóticas del Perú. <br> Diviérte y sé 
parte de la cultura gastronómica que tiene el Perú. </font> 
</body> 
</html>

Nos debe quedar así:

Etiquetas HTML de texto

Otros atributos

<PRE>

Nos indica que el texto a insertar será visualizado con el mismo formato con el que fue escrito en código HTML.

<ADDRESS>

El comando se emplea para indicar que un texto representa una dirección o una firma. Usualmente se activa en cursiva y tabulado.

<BLOCKQUOTE>

Se utiliza para resaltar una cita. Este comando suele representar al texto en sangría a la izquierda y derecha del texto insertado dentro de: <BLOCKQUOTE>….</BLOCKQUOTE>