Creando Formulario en html - Detodoprogramacion.org

BUSCADOR

Aprende a como descargar

06 junio 2013

Creando Formulario en html

Creando Formulario  en html
Español | 8 Kb | Rar |  Publicación: 2013 | Pass:www.detodoprogramacion.com
Descripción:
Este ejemplo muestra una formulario para un boletín de inscripción. aunque no tiene mucho stylo css pero creo que no es problema para aplarlo y quede a nuestro gusto.
 Se utiliza una variedad de controles de formulario como son:
<form> utiliza el atributo de acción para indicar la página que los datos que se está enviando a.


<fieldset> se utiliza para agrupar los datos relacionados
 <label> indica la finalidad de cada elemento de un control. del formulario
<input> para los botones,radios etc...

Bueno manos a la Obra!!

Creamos nuestro Form de esta forma

<form action="" method="get">
   AQUI VA TODO EL CÓDIGO
</form>


Añadimos la primera parte del contenedor con la etiqueta <fieldset>
<fieldset>
                <legend>Datos Personales:</legend>
                <label><b>Nombres:</b> <input  type="text" name="name" size="25" maxlength="100"></label>
                <label><b>Email:</b> <input type="email" name="email" size="25" maxlength="100"></label><br />
</fieldset><br />

Quedaría asi:
Datos Personales:

Luego creamos el otro contener para los demas datos con la etiqueta <fieldset>

<fieldset>
                <legend>Su Opini&oacute;n:</legend>
                <p>
                    <label for="hear-about">C&oacute;mo se enter&oacute; de nosotros?</label>
                    <select name="referrer" id="hear-about">
                        <option value="google">Google</option>
                        <option value="friend">Amigos</option>
                        <option value="advert">Publicidad</option>
                        <option value="other">Otro</option>
                    </select>
                </p>
                <p>
                    Quieres visitarnos de nuevo?<br />
                    <label><input type="radio" name="rating" value="yes" /> Si</label>
                    <label><input type="radio" name="rating" value="no" /> No</label>
                    <label><input type="radio" name="rating" value="maybe" /> Quiza</label>
                </p>
                <p>
                    <label for="comments">Comentario:</label><br />
                    <textarea rows="4" cols="40" id="comments"></textarea>
                </p>
                <label><input type="checkbox" name="subscribe" checked="checked" />  Recibir Actualizaciones por correo electr&oacute;nico</label><br />
                <input class="button" type="submit" value="Enviar opini&oacute;n" />
            </fieldset>

Quedaria asi:

Su Opinión:

Quieres visitarnos de nuevo?





Ahora inegrando todo el código dentro de <form action="" method="get"> </form> y con un podo de CSS para alinear y efecto del boton el resultado final sería Este:

Datos Personales:

Su Opinión:

Quieres visitarnos de nuevo?




 Puedes cambiar la apariecnia de Radio Button y Checkbox como lo explicamos AQUI

**No tiene funcionalidad ya que falta crear el archivo .php para poder recibir los datos.

1 comentario:

Post Top Ad