devfzn
d56594f7f4
Uso de 'texarea', 'radio' y 'checkbox' inputs. 'inputs' dentro de 'labels'. Estilos css. selector 'select' para elegír un item que representa un 'option' de una lista desplegable.
68 lines
2.7 KiB
HTML
68 lines
2.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="es">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width">
|
|
<title>Contacto - Barbería Alura</title>
|
|
<link rel="stylesheet" href="./reset.css"/>
|
|
<link rel="stylesheet" href="./style.css"/>
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<div class="caja">
|
|
<h1><img src="./imagenes/logo.png"></h1>
|
|
<nav>
|
|
<ul>
|
|
<li><a href="./index.html">Home</a></li>
|
|
<li><a href="./productos.html">Productos</a></li>
|
|
<li><a href="./contacto.html">Contacto</a></li>
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
<main>
|
|
<form>
|
|
<label for="nombre_apellido">Nombre y Apellido</label>
|
|
<input type="text" id="nombre_apellido" class="input-padron">
|
|
|
|
<label for⁼"email">Correo Eletrónico</label>
|
|
<input type="text" id="email" class="input-padron"/>
|
|
|
|
<label for⁼"telefono">Teléfono</label>
|
|
<input type="text" id="telefono" class="input-padron"/>
|
|
|
|
<label for="mensaje">Mensaje</label>
|
|
<textarea id="mensaje" cols="70" rows="10"class="input-padron"></textarea>
|
|
<div>
|
|
<p>Como prefieres que te contactemos?</p>
|
|
|
|
<label for="radio-email"><input type="radio" name="contacto"
|
|
value="email" id="radio-email"> Email</label>
|
|
|
|
<label for="radio-telefono"><input type="radio" name="contacto"
|
|
value="telefono" id="radio-telefono"> Teléfono</label>
|
|
|
|
<label for="radio-whatsap"><input type="radio" name="contacto"
|
|
value="whatsap" id="radio-whatsap"> Whatsapp</label>
|
|
</div>
|
|
<div>
|
|
<p>En que horario prefieres ser contactado?</p>
|
|
<select>
|
|
<option>Mañana</option>
|
|
<option>Tarde</option>
|
|
<option>Noche</option>
|
|
</select>
|
|
</div>
|
|
<label class="checkbox"><input type="checkbox">Te interesa recibir novedades y ofertas?</label>
|
|
<input type="submit" value="Enviar Formulario"/>
|
|
</form>
|
|
</main>
|
|
<footer>
|
|
<img src="./imagenes/logo-blanco.png">
|
|
<!-- Copyleft unicode 🄯 🄯 -->
|
|
<!-- Copyright unicode © © -->
|
|
<p class="copyright">🄯 CopyLeft 2023 - DevFzn</p>
|
|
</footer>
|
|
</body>
|
|
</html>
|