FORMULARIOS EN PHP: julio 2016

jueves, 28 de julio de 2016

EXPORTAR A EXCEL DESDE PHP

Debemos de hacer un link desde el archivo en donde nos muestra los datos.
luego realizamos otro archivo con el mismo codigo que el de mostrar.
con la diferencia que insertamos antes de Html el siguiente código.
<?

header("Content-Type: application/vnd.ms-excel");

header("Expires: 0");

header("Cache-Control: must-revalidate, post-check=0, pre-check=0");

header("content-disposition: attachment;filename=NOMBRES.xls");

?>

"el texto filename nombre.xls es el nombre del archivo que crearemos lo puedes cambiar a tu gusto

esto es un comentario no es parte del codigo"

hover galeria

#galeria img:hover {

opacity:1;
z-index:20;
-moz-transform:scale(1.5); /* zoom en navegador Firefox */
-webkit-transform:scale(1.5); /* zoom en navegador Chrome y Safari */
-o-transform:scale(1.5);
}

GALERIA

lunes, 25 de julio de 2016

ESPACIO DE COMENTARIOS

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;
}

miércoles, 20 de julio de 2016

MENU PRINCIPAL

PRIMERO HACEMOS NUESTRO MENÚ EN HTML
<html>
<head>
<title> pagina</title>
<link rel="stylesheet" type="text/css"
href="css/estilos.css">
<meta charset="utf-8">
</head>
<body>

<nav>
<ul>
<li><a href="inicio.html">INICIO</a></li>
<li><a href="inicio.html">VISION</a></li>
<li><a href="inicio.html">MISIÓN</a></li>
<li><a href="inicio.html">NOVEDADES</a></li>
<li><a href="inicio.html">NOTICIAS</a></li>
</ul>
</nav>
</body>
</html>
_______________________________________________________
SEGUNDO APLICAMOS NUESTRO MENÚ CON CSS
body{
background: -webkit-linear-gradient(left, rgba(212,228,239,1) 0%, rgba(134,174,204,1) 100%);
}
nav{
/*Bordes redondeados*/
-webkit-border-radius:10px;/*Para chrome y Safari*/
-moz-border-radius:10px;/*Para Firefox*/
-o-border-radius:10px;/*Para Opera*/
border-radius:10px;/*El estandar por defecto*/
background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#CCC));/*Para chrome y Safari*/
/*Degradados*/
background-image: -moz-linear-gradient(top center, #FFF, #CCC);/*Para Firefox*/
background-image: -o-linear-gradient(top, #FFF, #CCC);/*Para Opera*/
background-image: linear-gradient(top, #FFF, #CCC);/*El estandar por defecto*/
overflow:hidden;
padding:10px 10px;
width:1000px;
margin: 0 auto;
}
nav ul li{
/*Bordes redondeados*/
-webkit-border-radius:5px;/*Chrome y Safari*/
-moz-border-radius:5px;/*Firefox*/
-o-border-radius:5px;/*Opera*/
border-radius:5px;/*Estandar por defecto*/
float:left;
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
font-weight:bold;
margin-right:90px;
text-align:center;
/*Sombras para texto, los mismos parametros que box-shadow*/
text-shadow: 0px 1px 0px #FFF;
}
nav ul li:hover{
/*Degradado de fondo*/
background-image: -webkit-gradient(linear, left top, left bottom, from(#FFF), to( #E3E3E3));/*Chrome y Safari*/
background-image: -moz-linear-gradient(top center, #FFF, #E3E3E3);/*Firefox*/
background-image: -o-linear-gradient(top, #FFF, #E3E3E3);/*Opera*/
background-image: linear-gradient(top, #FFF, #E3E3E3);/*Estandar por defecto*/
/*Sombras*/
-webkit-box-shadow: 1px -1px 0px #999;/*Chrome y Safari*/
-moz-box-shadow: 1px -1px 0px #999;/*Firefox*/
-o-box-shadow: 1px -1px 0px #999;/*Opera*/
box-shadow: 1px -1px 0px #999;/*Estandar por defecto*/
border:1px solid #E3E3E3;
}
nav ul li a{
color:#999;
display:block;

padding:10px;
text-decoration:none;
/*Transiciones*/
-webkit-transition: 0.4s linear all;
-moz-transition: 0.4s linear all;
-o-transition: 0.4s linear all;
transition: 0.4s linear all;
}
nav ul li a:hover {
color:#000;
}

martes, 12 de julio de 2016

aplicando css a html

index
_________________________________________________________
<html>
<head>
<title> pagina</title>
<link rel="stylesheet" type="text/css"
href="css/estilos.css">
<meta charset="utf-8">
</head>
<body>
<p id="parrafo"> CSS es un lenguaje utilizado en la presentación
de documentos HTML. Un documento HTML
viene siendo coloquialmente “una página web”. Entonces
podemos decir que el lenguaje CSS sirve para organizar
la presentación
y aspecto de una página web.
</p>
</body>
</html>
_________________________________________
css_______________________________________________________________________________
body
{
background-color:#0489B1;
}
#parrafo
{
color:#DF3A01;
font-family:arial;
font-size:20px;
}

miércoles, 6 de julio de 2016

index

<html>

<head>

<title>pagina</title>

href="css/estilos.css">

</head>

<body>

<tr>

<td>

<ul>

<li><a href="inicio.html" target="principal">INICIO</a></li>

<li><a href="vision.html" target="principal">VISIÓN</a></li>

<li><a href="mision.html"target="principal">MISIÓN</a></li>

<li><a href="contactos.html"target="principal">CONTACTOS</a></li>

</ul>

</div>

</td>

</tr>

<tr>

<td>

width="900" height="800"></iframe>

</td>

</tr>

</table>

</body>

</html>