1

Tutorial Rápido: Crear una Web Básica con HTML y CSS

Paso 1: Estructura HTML

  1. Crea una carpeta para tu proyecto y dentro de ella, un archivo “index.html”.
  2. Abre “index.html” y copia este código:
<!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>&copy; 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!

Escribe tu comentario
+ 2