10 diciembre, 2023

Todo Programación

Cursos, código fuente y ejemplos.

Html 5 – Capítulo 02 – Etiquetas de encabezados y enlaces

2 minutos de lectura
Html 5, Capítulo 02, Etiquetas de encabezados y enlaces

HTML5 es la base de la web moderna, permitiendo la estructuración y presentación de contenidos en línea. Las etiquetas son fundamentales para definir los elementos de una página web. En este manual, exploraremos etiquetas de texto esenciales como <h1>, <p>, <a>, <strong> y <em>. Además, reforzaremos estos conceptos con ejercicios resueltos para una comprensión práctica.

Etiqueta <h1> – Encabezados

Los encabezados se utilizan para estructurar el contenido de una página y proporcionar jerarquía visual.

<h1>Este es un encabezado de nivel 1</h1>
  • Los encabezados van desde <h1> (más importante) hasta <h6> (menos importante).
  • Se utiliza para títulos, subtítulos y secciones destacadas.

Etiqueta <p> – Párrafos

La etiqueta <p> se utiliza para crear párrafos de texto.

<p>Este es un párrafo de ejemplo.</p>
  • Se utiliza para separar y estructurar el contenido en bloques de texto.
  • Ayuda a mejorar la legibilidad y organización del contenido.

Etiqueta <a> – Enlaces

La etiqueta <a> se utiliza para crear enlaces a otras páginas o recursos en línea.

<a href="https://www.ejemplo.com">Visita Ejemplo.com</a>
  • href define la URL a la que enlaza el elemento.
  • Puede usarse para enlazar a otras páginas, archivos, correos electrónicos, etc.

Etiqueta <strong> – Texto Fuerte

La etiqueta <strong> se utiliza para resaltar texto importante y hacerlo visualmente más fuerte.

<p>Este es un <strong>texto importante</strong> en un párrafo.</p>
  • Se utiliza para enfatizar el significado y la importancia del texto.
  • Por defecto, el texto fuerte suele mostrarse en negrita.

Etiqueta <em> – Énfasis

La etiqueta <em> se utiliza para aplicar énfasis o énfasis leve a un texto.

<p>Este es un <em>texto enfatizado</em> en un párrafo.</p>
  • Similar al <strong>, pero con un énfasis más sutil.
  • Por defecto, el texto enfatizado suele mostrarse en cursiva.

Ejercicios Resueltos

Ejercicio 1: Crear una Página de Introducción

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Página de Introducción</title>
</head>
<body>
    <h1>Bienvenidos a mi sitio web</h1>
    <p>Este es un espacio para explorar diversos temas.</p>
    <a href="https://www.ejemplo.com">Visita Ejemplo.com</a>
    <p>Recuerda que <strong>aprender es divertido</strong>.</p>
</body>
</html>

Ejercicio 2: Cita Enlazada

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Cita Enlazada</title>
</head>
<body>
    <p>La <em>sabiduría</em> es el camino hacia el éxito.</p>
    <p>Leer más en <a href="https://www.citas.com">Citas Inspiradoras</a>.</p>
</body>
</html>

Conclusión

Las etiquetas de texto en HTML5 permiten definir la estructura y el significado del contenido. Mediante la comprensión de etiquetas como <h1>, <p>, <a>, <strong> y <em>, puedes comunicar información de manera efectiva en tus páginas web. Los ejercicios resueltos te han proporcionado experiencia práctica en la aplicación de estas etiquetas.


Copyright © Todos los derechos reservados. | Newsphere por AF themes.