Paso 1: Estructura HTML
<!DOCTYPE html><html><head><title>Mi Web Básica</title><linkrel="stylesheet"href="styles.css"></head><body><header><h1>Mi Web Básica</h1></header><nav><ul><li><ahref="#">Inicio</a></li><li><ahref="#">Acerca de</a></li><li><ahref="#">Contacto</a></li></ul></nav><main><section><h2>Bienvenidos</h2><p>¡Hola! Esta es mi primera web con HTML y CSS.</p></section></main><footer><p>© 2023 - Todos los derechos reservados</p></footer></body></html>
Paso 2: Estilos CSS
1.Abre etiqueta Style en el archivo “index.html”.
2.Copia y Pega estos estilos básicos:
body, h1, h2, p {
margin: 0;
padding: 0;
font-family: Arial, sans-serif;
}
header {
background-color: #333;
color: white;
text-align: center;
padding: 1em0;
}
navul {
list-style: none;
display: flex;
justify-content: center;
background-color: #eee;
padding: 1em;
}
nava {
text-decoration: none;
color: #333;
margin: 01em;
}
main {
padding: 2em;
}
footer {
text-align: center;
padding: 1em0;
background-color: #333;
color: white;
}
Paso 3: Visualización
1.Abre “index.html” en tu navegador para ver tu web en acción.
2.¡Listo! Ahora tienes una web básica creada con HTML y CSS.
¡Explora y personaliza para aprender más y mejorar tus habilidades de diseño web!