COMO CREAR UN FORMULARIO CON HTML&CSS - PCSYSTEMSOLUTIONS

Breaking

Disqus for noticias-informaticas

"Creando un mundo Libre"

viernes, 11 de mayo de 2018

COMO CREAR UN FORMULARIO CON HTML&CSS

, , , ,
Hola seas bienvenido a este post en esta ocasión les traeremos un poco a como formular un formulario para tu sitio web , en el cual aprenderemos un poco sobre html & css , este formulario es básico para poder hacerlo funcionar correctamente , necesitaras tanto como Javascript , así como php , en este tutorial como había dicho antes solo estaremos abordando los temas de html & css , bien comenzamos...






CÓDIGO HTML
 
<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Formulario</title>
 <link rel="stylesheet" href="boton.css">
 <link rel="stylesheet" type="text/css" href="estilos.css">
 <style>
  @import url(estilos.css);

 </style>
</head>
<body>
 <form action="">
  <p>Nombre:</p>
  <input type="text" class="field"> <br/>

  <p>Correo electrónico:</p>
  <input type="text" class="field"> <br/>

  <p>Asunto:</p>
  <input type="text" class="field"> <br/>

  <p>Mensaje:</p>
  <textarea class="field"></textarea> <br/>

  <p class="center-content">
   <input type="submit" class="btn btn-green" value="Enviar Datos">
  </p>

 </form>
</body>
</html>






CÓDIGO CSS PARTE #1


body{font-family: Arial; background-color: #18A383; box-sizing: border-box;}

  form{
   background-color: white;
   border-radius: 3px;
   color: #999;
   font-size: 0.8em;
   padding: 20px;
   margin: 0 auto;
   width: 300px;
  }

  input, textarea{
   border: 0;
   outline: none;

   width: 280px;
  }

  .field{
   border: solid 1px #ccc;
   padding: 10px;

   
  }

  .field:focus{
   border-color: #18A383;
  }

  .center-content{
   text-align: center;
  }




CÓDIGO CSS  PARTE#2


.btn{
 border-radius: 3px;
 display: inline-block;
 padding: 20px 15px;
 text-decoration: none;
 text-shadow: 0 1px 0 rgba(255,255,255,0.3);
 box-shadow: 0 1px 1px rgba(0,0,0,0.3); 
}

.btn-green{
 color: white;
 background-color: #3CC93F;
}
.btn-green:hover{
 background-color: #37B839; 
}
.btn-green:active{
 background-color: #29962A;
}










DESCARGA : SERVIDOR ACTIVO (MEGA)
PESO :  1.27 KB
CONTRASEÑA : NO CONTIENE CONTRASEÑA
CREADOR : HACKGOGE


Read more
Author Image

Acerca de Pcsystemsolutions
Pcsystemsolutions, somos moderadores , apasionado a la informatica, publicamos articulos relacionados con la informatica , hacemos videos en youtube , publicamos trucos , parches para juegos , mods para Gta5 entre otras juegos , publico peliculas totalmente gratis y en mega y mediafire , de igual manera traemos tips para navegar con seguridad en internet y traemos todo de manera gratis , aparte de todo lo anterior , hacemos mantenimiento en linea y a domicilio ,creamos sistemas informaticos, distribuimos programas con licencia originales e instalamos juegos en tu pc y play station totalmente original...

By en
Etiquetas: , , , ,

No hay comentarios.:

Publicar un comentario

Suscribirse a: Comentarios de la entrada (Atom)