1. Formateo de texto
Sigamos estudiando HTML...
Párrafos (p)
El tag <p>
se usa para crear párrafos
de texto. Los párrafos ayudan a dividir el texto en bloques lógicos, mejorando
la legibilidad y la percepción de la información.
Ejemplo:
<p>Este es el primer párrafo de texto. Contiene cierta cantidad de información.</p>
<p>Este es el segundo párrafo de texto. Está separado del primer párrafo.</p>
Texto negrita (b)
El tag <b>
se usa para resaltar texto en negrita
(bold)
. Esto permite enfatizar la importancia de ciertas
palabras o frases.
<p>Este es un texto <b>importante</b>.</p>
Texto en cursiva (i)
El tag <i>
se usa para resaltar texto en cursiva
(letra inclinada, italic
). A menudo se utiliza para
designar términos, títulos de libros, palabras extranjeras, etc.
Ejemplo:
<p>Este es un <i>término</i> resaltado en cursiva.</p>
2. Encabezados (h1 - h6)
Los encabezados en HTML se usan para estructurar el contenido y
crear una jerarquía de encabezados en la página. Existen seis niveles de
encabezados, donde <h1>
es el más importante y
<h6>
el menos importante.
-
<h1>
— El encabezado más importante y grande. Generalmente se usa como el encabezado principal de la página. -
<h2>
— Se usa para subtítulos que siguen a<h1>
. -
<h3>
— Nivel de encabezado más bajo que<h2>
. -
<h4>
— Nivel de encabezado más bajo que<h3>
. -
<h5>
— Nivel de encabezado más bajo que<h4>
. -
<h6>
— El encabezado más pequeño y menos relevante.
Ejemplo:
<h1>Encabezado principal de la página</h1>
<h2>Subtítulo de nivel 2</h2>
<h3>Subtítulo de nivel 3,</h3>
3. Etiquetas adicionales en el documento head
Hay etiquetas que podrías encontrar en el futuro en ejemplos de HTML, quiero hablar brevemente de ellas:
1. Etiqueta <title>
La etiqueta <title> define el
nombre de la página que se muestra en la pestaña del navegador
. Es lo primero que ve el usuario al abrir la página. Casi siempre
está presente en todas las páginas. Por defecto es agregado por el editor de HTML, pero
para proyectos educativos no tiene mucho valor.
2. Etiqueta <meta charset="UTF-8">
La etiqueta <meta>
dentro de
<head>
define la codificación de caracteres para el documento.
UTF-8 es la codificación más común
, que soporta la mayoría de los idiomas del mundo. Hablaremos sobre las codificaciones
más adelante.
3. Etiqueta
<meta name="viewport" content="width=device-width,
initial-scale=1.0">
Esta etiqueta también se encuentra dentro de
<head>
. Asegura
una correcta visualización de la página en dispositivos móviles
. Define el ancho del área de visualización (viewport) igual al ancho de la pantalla
del dispositivo y el escalado inicial de la página.
4. Etiqueta <link rel="stylesheet" href="styles.css">
La etiqueta <link/>
conecta un
archivo CSS externo para estilizar la página
.
El atributo rel="stylesheet" indica que es una hoja de estilos, y
href="styles.css" define la ruta al archivo de estilos.
5. Etiqueta <script src="script.js" defer></script>
La etiqueta <script>
conecta un
archivo JavaScript externo para añadir interactividad a la página
. El atributo src
define la ruta al archivo del script, y
defer
indica al navegador que el script debe ejecutarse después de que se cargue el documento HTML.
GO TO FULL VERSION