Dia 19
This commit is contained in:
Marcos Lopez
parent
85e8122aa3
commit
9310ef6ca4
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Formularios 1</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<form method="get" action="../gracias.html">
|
||||
<fieldset>
|
||||
<legend>Datos Personales</legend>
|
||||
<label>Nombre
|
||||
<input type="text" name="nombre" placeholder="Escribe tu nombre...">
|
||||
</label> <br>
|
||||
<label>Apellidos
|
||||
<input type="text" name="apellidos" placeholder="Escribe tus apellidos...">
|
||||
</label> <br>
|
||||
<label>DNI
|
||||
<input type="text" name="dni" placeholder="NIF">
|
||||
</label> <br>
|
||||
<br>
|
||||
<label>Sexo</label>
|
||||
<input type="radio" name="sexo" value="masculino">Masculino
|
||||
<input type="radio" name="sexo" value="femenino">Femenino
|
||||
<input type="radio" name="sexo" value="otro">Otros
|
||||
<input type="radio" name="sexo" value="nc" checked>Prefiero no contestar
|
||||
<br>
|
||||
<label> Estoy de acuerdo con los terminos y condiciones
|
||||
<input type="checkbox" name="condiciones">
|
||||
</label> <br>
|
||||
<input type="submit" name="enviar" value="Enviar" />
|
||||
<input type="reset" name="limpiar" value="Limpiar formulario" />
|
||||
</fieldset>
|
||||
</form>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -0,0 +1,73 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Formularios 2</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h1>Formulario de registro</h1>
|
||||
<form method="get" action="../gracias.html">
|
||||
|
||||
<p>
|
||||
<label>Nombre
|
||||
<input type="text" name="nombre" placeholder="Escribe tu nombre...">
|
||||
</label>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<label>Apellidos
|
||||
<input type="text" name="apellidos" placeholder="Escribe tus apellidos...">
|
||||
</label>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<label>Sexo</label>
|
||||
<input type="radio" name="sexo" value="h">Hombre
|
||||
<input type="radio" name="sexo" value="m">Mujer
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<label>Correo
|
||||
<input type="email" name="email" placeholder="email...">
|
||||
</label>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<label for="poblacion">Poblacion</label>
|
||||
<select name="poblacion" required>
|
||||
<option disabled selected>-- Selecciona --</optiondisabl>
|
||||
<option value="a coruña">A Coruña</option>
|
||||
<option value="lugo">Lugo</optionselected>
|
||||
<option value="orense">Ourense</option>
|
||||
<option value="pontevedra">Pontevedra</option>
|
||||
</select>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<label> Descripcion
|
||||
<textarea name="condiciones" cols="40" rows="6"></textarea>
|
||||
</label>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<label>
|
||||
<input type="checkbox" name="publicidad">Deseo recibir informacion sobre novedades y ofertas
|
||||
</label>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<label>
|
||||
<input type="checkbox" name="condiciones" required>Declaro haber leido y aceptar las condiciones
|
||||
generales del
|
||||
programa...
|
||||
</label>
|
||||
</p>
|
||||
|
||||
<input type="submit" name="enviar" value="Enviar" />
|
||||
</form>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
|
|
@ -0,0 +1,80 @@
|
|||
@charset "UTF-8";
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
text-decoration: none;
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
body{
|
||||
padding: 2em;
|
||||
}
|
||||
h2{
|
||||
color: #718751;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
form{
|
||||
margin: auto;
|
||||
border: 3px;
|
||||
border-style: solid;
|
||||
border-color: #718751;
|
||||
border-radius: 0.5em;
|
||||
padding:1em;
|
||||
max-width: 350px;
|
||||
min-width: 250px;
|
||||
background-color: #E2001A;
|
||||
color: white;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
fieldset {
|
||||
border: 3px;
|
||||
padding: 0.5em;
|
||||
border-style: solid;
|
||||
border-color: #718751;
|
||||
border-radius: 0.5em;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
legend{
|
||||
margin-left: 0.5em;
|
||||
font-size: 1em;
|
||||
font-weight: bold;
|
||||
color: #718751;;
|
||||
}
|
||||
|
||||
input[type=text], input[type=tel]{
|
||||
background-color:#718751;
|
||||
color: white;
|
||||
}
|
||||
|
||||
label{
|
||||
width: 5em;
|
||||
}
|
||||
.input_flex{
|
||||
display: flex;
|
||||
flex-direction:row;
|
||||
gap: 0.5em;
|
||||
padding: 0.1em;
|
||||
}
|
||||
|
||||
|
||||
.btn{
|
||||
padding: 0.2em;
|
||||
background-color: #E2001A;
|
||||
border: 2px solid #718751;
|
||||
color: white;
|
||||
font-weight: bold;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
@media (max-width: 550px) {
|
||||
.input_flex{
|
||||
display: flex;
|
||||
flex-direction:column;
|
||||
gap: 0.5em;
|
||||
padding: 0.1em;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,61 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="./css/style.css">
|
||||
<title>Practica 3</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h2>Pedido de pizza</h2>
|
||||
|
||||
<form action="../gracias.html">
|
||||
<fieldset>
|
||||
<legend>La pizza</legend>
|
||||
<p>
|
||||
<p>Ingresdientes</p>
|
||||
<input type="checkbox" name="queso"> Queso <input type="checkbox" name="pimiento"> Pimiento <br>
|
||||
<input type="checkbox" name="cebolla"> Cebolla <input type="checkbox" name="atun"> Atún <br>
|
||||
<input type="checkbox" name="tomate"> Toamte <input type="checkbox" name="jamon"> Jamon
|
||||
</p>
|
||||
<label for="tamano">Tamaño</label><br>
|
||||
<input type="radio" name="tamano" value="pequena" checked> Pequeña <br>
|
||||
<input type="radio" name="tamano" value="mediana"> Mediana <br>
|
||||
<input type="radio" name="tamano" value="grande"> Grande <br>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>Datos de entrega</legend>
|
||||
|
||||
<p class="input_flex">
|
||||
<label for="name">Nombre </label>
|
||||
<input type="text" name="nombre" placeholder="Escribe tu nombre...">
|
||||
</p>
|
||||
<p class="input_flex">
|
||||
<label for="direccion">Direccion</label>
|
||||
<input type="text" name="direccion" placeholder="Escribe tu direccion...">
|
||||
|
||||
</p>
|
||||
<p class="input_flex">
|
||||
<label for="telefono">Telefono</label>
|
||||
<input type="tel" name="telefono" placeholder="982210251">
|
||||
</p>
|
||||
<p>
|
||||
<label for="instrucciones">Instrucciones especiales</label> <br>
|
||||
<textarea name="instrucciones" rows="10" cols="24"></textarea>
|
||||
</p>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>Metodo de pago</legend>
|
||||
<select name="pago">
|
||||
<option value="efectivo" selected>Efectivo</option>
|
||||
<option value="tarjeta">Tarjeta</option>
|
||||
<option value="bizum">Bizum</option>
|
||||
</select>
|
||||
</fieldset>
|
||||
<input type="submit" class="btn" value="ok">
|
||||
</form>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Binary file not shown.
|
|
@ -1,39 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Formularios 1</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<form action="">
|
||||
<fieldset>
|
||||
<legend>Datos Personales</legend>
|
||||
<label>Nombre
|
||||
<input type="text" placeholder="Escribe tu nombre...">
|
||||
</label> <br>
|
||||
<label>Apellidos
|
||||
<input type="text" placeholder="Escribe tus apellidos...">
|
||||
</label> <br>
|
||||
<label>DNI
|
||||
<input type="text" placeholder="NIF">
|
||||
</label> <br>
|
||||
<br>
|
||||
<input type="radio" name="radio1"><label for="radio1">Masculino</label>
|
||||
<input type="radio" name="radio2"><label for="radio2">Femenino</label>
|
||||
<input type="radio" name="radio3"><label for="radio3">Otros</label>
|
||||
<input type="radio" name="radio3"><label for="radio3">Prefiero no contestar</label>
|
||||
<br>
|
||||
<label> Estoy de acuerdo con los terminos y condiciones
|
||||
<input type="checkbox">
|
||||
</label> <br>
|
||||
<input type="submit" name="enviar" value="Enviar POR CORREO" />
|
||||
<input type="reset" name="limpiar" value="Limpiar el
|
||||
formulario" />
|
||||
</fieldset>
|
||||
</form>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
Reference in New Issue
Block a user