Código a trabajar
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mi primera página web</title>
<link rel="stylesheet" href="./estilos/styles.css">
</head>
<body>
<header>
<h1>Primera página web</h1>
<h2>Subtítulo</h2>
<h3>Encabezado más pequeño</h3>
<nav>
<a href="#inicio">Inicio</a>
<a href="#contacto">Contacto</a>
<a href="#about">Sobre Nosotros</a>
<a href="#blog">Blog</a>
</nav>
</header>
<main>
<section id="inicio">
<p>Este es un párrafo de ejemplo.</p>
<a href="https://www.google.com">Ir a Google</a>
</section>
<section>
<h2>Lista de elementos</h2>
<ul>
<li>Elemento 1</li>
<li>Elemento 2</li>
<li>Elemento 3</li>
</ul>
</section>
<section>
<h2>Tabla de información</h2>
<table>
<thead>
<tr>
<th>Nombre</th>
<th>Edad</th>
</tr>
</thead>
<tbody>
<tr>
<td>Juan</td>
<td>25</td>
</tr>
<tr>
<td>Ana</td>
<td>30</td>
</tr>
<tr>
<td>Pedro</td>
<td>28</td>
</tr>
</tbody>
</table>
</section>
<section id="formulario">
<h2>Formulario</h2>
<form action="/procesar" method="POST">
<label for="nombre">Nombre:</label>
<input type="text" id="nombre" name="nombre" placeholder="Ingresa tu nombre">
<button type="submit">Enviar</button>
</form>
</section>
</main>
<br> <br> <br> <br>
<footer>
<p>Derechos reservados 2025</p>
</footer>
</body>
</html>
Copia este código en html para poder trabajar con CSS y observar su funcionamiento