programacion-web
Version:
validacion-formularios
44 lines (43 loc) • 2.16 kB
HTML
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Contacto | DevSolutions</title>
<link rel="stylesheet" href="css/ejerciciocss9.css">
<link relf="https://fonts.googleapis.com/css2?family=Inter:wght@400;500&display=swap" rel="stylesheet">
<head>
<body>
<div class="contenedor-formulario">
<h1>Contactanos</h1>
<p class="subtitulo">Tienes dudas? Escribenos y te respondemos en 24 h.</p>
<form class="formulario">
<!-- grupo:1 datos basicos-->
<div class="grupo-formulario">
<label for="nombre">Nombre Completo</label>
<input type="text" id="nombre" name="nombre" placeholder="Ej: Ana Perez" required>
</div>
<!-- grupo:2 email y telefono -->
<div class="grupo-doble">
<div class="grupo-formulario">
<label for="email">Email</label>
<input type="email" id="email" placeholder="ana@ejemplo.com" required>
</div>
<div class="grupo-formulario">
<label for="telefono">Teléfono <span>(Opcional)</span></label>
<input type="tel" id="telefono" placeholder="+52 55 1234 5678">
</div>
</div>
<!-- grupo:3 mensaje -->
<div class="grupo-formulario">
<label for="mensaje">Mensaje</label>
<textarea id="mensaje" rows="5" placeholder="Describe tu consulta..." required></textarea>
</div>
<!--boton -->
<button type="submit" class="boton-enviar">
Enviar Mensaje<span>-></span>
</button>
</form>
</div>
</body>
</html>