domingo, 24 de julio de 2016

FORMULARIO CON SELECT OPTION

<html>
<head>
<title> </title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="css/estilos">
</head>
<body>
<form action="guardar.php" method="post">
<label for="titulo"> CONTROL DE PRODUCTOS</label>
<label for="producto">PRODUCTO</label>
<input type="text" name="producto"></input>
<label for="producto">CATEGORÍA</label>
<select  type="text" name="categoria">
<option>LATEOS</option>
<option>CARNES</option>
<option>BEBIDAS</option>
</select>
<label for="fecha">FECHA DE INGRESO</label>
<input type="date" name="fecha"></input>
<label for="cantidad">CANTIDAD INGRESADA</label>
<input type="text" name="cantidad"></input>
<label for="mostrar"><a href="mostrar.php">MOSTRAR DATOS<a></label>
<button type="submit" value="ingresar">INGRESAR</button>
</form>
</table>
</body>
</html>
_________________________________________________________________________________
APLICANDO CSS A NUESTRO FORMULARIO
form{
width:40%;
height:60%;
border:1px solid blue;
margin: 0 auto;

padding:12px 12px;
}
label{
display:block;
width:90%;
border-bottom:12px;
margin-bottom:15px;

}
input{
width:90%;
margin-bottom:15px;
border-bottom:12px;
}
select{
width:90%;
border-bottom:12px;
margin-bottom:15px;
}
button{
border:none;
background:gray;
padding:14px 14px;
border-radius: 0.5em;
cursor:pointer;
border:2px solid black;
}
input:focus{
border:2px solid black;
}
button:hover{
border:2px solid blue;
}

No hay comentarios:

Publicar un comentario