Cuerpo

Parte de la sección Estilos con CSS del Journey de HTML de Coddy. Lección 50 de 76.

Desafío

Fácil

En este proyecto, crearemos y daremos estilo a un formulario de inicio de sesión sencillo. Este proyecto te ayudará a practicar conceptos clave de CSS, entre ellos:
✅ Centrar elementos perfectamente en una página web
✅ Dar estilo a elementos de formulario, como campos de entrada y botones
✅ Trabajar con bordes, sombras y espaciado
✅ Dejar espacio para la creatividad en el diseño

Al final del proyecto, tendrás un formulario de inicio de sesión con un estilo cuidado, de aspecto moderno y pulido, similar a la imagen de abajo.

Aplica estilos a la etiqueta <body>. Sigue los pasos a continuación:

Establece el color de fondo en un tono claro de tu elección.
Usa Flexbox para centrar el formulario tanto horizontal como verticalmente.
Establece la altura de la página en 100vh para que el formulario permanezca centrado incluso al cambiar el tamaño.

Pruébalo tú mismo

<html>
<head>
    <title>Login Form</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <form class="login-form">
        <h2>Login</h2>
        <input type="text" placeholder="Username">
        <input type="password" placeholder="Password">
        <button type="submit">Login</button>
    </form>
</body>
</html>