Formulario basado en Css

Este código es realmente sencillo y eta pensado para evitar el uso de tablas para sustituirlas con CSS y darle mejor desempeño a nuestro form

PLAIN TEXT
CSS:
  1. <style type="text/css" media="screen"> .formu {padding:0; width:300px;overflow:hidden;} .formu label {float:left; margin-right:10px; height:3em} .formu input, .formu select, .formu textarea {border:2px solid gray; width:99%;} .ancho1 {width:90px;} .ancho2 {width:190px;} .ancho3 {width:290px;} .formu button {float:left; margin-top:1.5em;}  body {     background-color: #CCCCCC; } .Estilo1 {font-family: "Trebuchet MS"} </style>

PLAIN TEXT
HTML:
  2. <h2 class="Estilo1">Ejemplo de Formulario basado en CSS</h2>
  3. <span class="Estilo1">Este es un ejemplo senecillo de como montar un Form basandonos en Css, ojala les sea util</span>
  4. <center> <form class="formu" action="#"> <label class="ancho1">
  5. Ejemplo:</label> <select name="tratamiento"> <option value="1">Ejemplo 1</option> <option value="2">Ejemplo 2</option> <option value="3">Ejemplo 3</option>   </select><input name="nombre" type="text" /> <label class="ancho3">Otro Tipo:
  6. <input name="nombre" type="text" /> </label><label class="ancho1">Lenguaje:</label> <select name="edad"> <option value="niño">CSS</option> <option value="joven">Php</option> <option value="maduro">AS 3</option> <option value="viejo">C#</option> </select>
  7. <button type="submit">Enviar</button>
  8. </form></center>

Ver el código en funcionamiento

Vota esta entrada: votar

Entradas Relacionadas

Únete a nuestro grupo de Facebook

Devblab en Facebook
Author: cuisi Comments: 2 comments Date: 6 Oct 2008
Categories: Css Tags: , , ,

There are 2 comments. Leave a comment!

  • ¬ Gabriel Rossini
    #78 October 13th, 2008 at 3:11 pm

    Te estoy contactando a ver si recibiste mi propuesta de
    implementar publicidad en su sitio.
    Tengo muchos anunciantes con el interés de exhibir avisos
    en sitios con el mismo perfil del tuyo.
    Actualmente somos la mayor fuente de renta para
    bloggers y webmasters de la internet.
    Me gustaria hacer la presentación de mi herramienta y una
    oferta de afiliación.
    Un saludo.

  • ¬ cuisi
    #79 October 13th, 2008 at 4:12 pm

    Amigo porque no me mandas un mail a devblab [arroba] gmail.com , para que me cuentes y me presentes las posibilidades, orita mi blog esta un poco parado porque e estado asistiendo a entrevistas de trabajo pero en la semana voy a la ultima y ya solo me va quedar esperar que me llamen... y pues tambien ya estare acuatilizando el blog a diario, saludos

Name (Req)

E-mail (Req)

URI

Message