HTML Formularios y entrada
Formularios HTML se utilizan para seleccionar los diferentes tipos de entrada del usuario.
Pruébelo usted mismo - Ejemplos
Crear campos de texto
¿Cómo crear campos de texto. El usuario puede escribir texto en un campo de texto.
¿Cómo crear campos de texto. El usuario puede escribir texto en un campo de texto.
Crear campo de contraseña
Cómo crear un campo de contraseña.
Cómo crear un campo de contraseña.
(Puede encontrar más ejemplos en la parte inferior de esta página)
Formularios HTML
Formularios HTML se utilizan para pasar datos a un servidor.
Un formulario HTML puede contener elementos de entrada como campos de texto, casillas de verificación, botones de radio-, presentar los botones y más. Un formulario puede contener listas de selección, textarea, fieldset, legend, y elementos de la etiqueta.
La etiqueta <form> se utiliza para crear un formulario HTML:
<form>
.
input elements
.
</form>
.
input elements
.
</form>
Formularios HTML - el elemento de entrada
El elemento de forma más importante es el elemento <input>.
El elemento <input> se utiliza para seleccionar la información del usuario.
Un elemento <input> puede variar de muchas maneras, dependiendo del tipo de atributo. Un elemento <input> puede ser de tipo campo de texto, casilla de verificación, botón de contraseña, radio, botón de enviar, y más.
A continuación se describen los tipos de entrada más comunes.
Los campos de texto
type="text"> <input define un campo de entrada de una línea que un usuario puede introducir texto en:
<form>
First name: <input type="text" name="firstname"><br>
Last name: <input type="text" name="lastname">
</form>
First name: <input type="text" name="firstname"><br>
Last name: <input type="text" name="lastname">
</form>
Como el código HTML anterior se ve en un navegador:
Nota: La forma en sí misma no es visible. También tenga en cuenta que el ancho predeterminado de un campo de texto es de 20 caracteres.
Campo de contraseña
type="password"> <input define un campo de contraseña:
<form>
Password: <input type="password" name="pwd">
</form>
Password: <input type="password" name="pwd">
</form>
Como el código HTML anterior se ve en un navegador:
Nota: Los caracteres en un campo de contraseña se enmascaran (mostrado como asteriscos o círculos).
Botones de radio
type="radio"> <input define un botón de radio. Los botones de radio permiten al usuario seleccionar sólo una de un número limitado de opciones:
<form>
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female
</form>
<input type="radio" name="sex" value="male">Male<br>
<input type="radio" name="sex" value="female">Female
</form>
Como el código HTML anterior se ve en un navegador:
Las casillas de verificación
type="checkbox"> <input define una casilla de verificación. Las casillas de verificación permiten al usuario seleccionar cero o más opciones de un número limitado de opciones.
<form>
<input type="checkbox" name="vehicle" value="Bike">I have a bike<br>
<input type="checkbox" name="vehicle" value="Car">I have a car
</form>
<input type="checkbox" name="vehicle" value="Bike">I have a bike<br>
<input type="checkbox" name="vehicle" value="Car">I have a car
</form>
Como el código HTML anterior se ve en un navegador:
Enviar Button
type="submit"> <input define un botón de envío.
Un botón de enviar se utiliza para enviar datos del formulario a un servidor. Los datos se envían a la página especificada en el atributo action del formulario. El archivo se define en el atributo de acción por lo general hace algo con las aportaciones recibidas:
<form name="input" action="html_form_action.asp" method="get">
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>
Username: <input type="text" name="user">
<input type="submit" value="Submit">
</form>
Como el código HTML anterior se ve en un navegador:
Si escribe algunos caracteres en el campo de texto y haga clic en el botón "Enviar", el navegador enviará sus comentarios a una página llamada "html_form_action.asp". La página le mostrará las aportaciones recibidas.
Más ejemplos
Los botones de radio
Cómo crear botones de opción.
Cómo crear botones de opción.
Las casillas de verificación
Cómo crear casillas de verificación. Un usuario puede seleccionar o cancelar la selección de una casilla de verificación.
Cómo crear casillas de verificación. Un usuario puede seleccionar o cancelar la selección de una casilla de verificación.
Simple lista desplegable
¿Cómo crear una lista desplegable simple.
¿Cómo crear una lista desplegable simple.
Lista desplegable con un valor pre-seleccionada
Cómo crear una lista desplegable con un valor pre-seleccionado.
Cómo crear una lista desplegable con un valor pre-seleccionado.
Área de texto
¿Cómo crear un control de entrada de texto de varias líneas. En un texto de la zona el usuario puede escribir un número ilimitado de caracteres.
¿Cómo crear un control de entrada de texto de varias líneas. En un texto de la zona el usuario puede escribir un número ilimitado de caracteres.
Crear un botón
¿Cómo crear un botón.
¿Cómo crear un botón.
Ejemplos de formularios
Fieldset alrededor form-data
Cómo crear un borde alrededor de los elementos de un formulario.
Cómo crear un borde alrededor de los elementos de un formulario.
Formulario con campos de texto y un botón de envío
Cómo crear un formulario con dos campos de texto y un botón de envío.
Cómo crear un formulario con dos campos de texto y un botón de envío.
Formulario con casillas de verificación
Cómo crear un formulario con dos casillas de verificación y un botón de envío.
Cómo crear un formulario con dos casillas de verificación y un botón de envío.
Formar con los botones de opción
Cómo crear un formulario con dos botones de radio, y un botón de envío.
Cómo crear un formulario con dos botones de radio, y un botón de envío.
Enviar e-mail de un formulario
Cómo enviar correo electrónico desde un formulario.
Cómo enviar correo electrónico desde un formulario.
Formularios HTML Etiquetas
Nuevo : Nuevas etiquetas en HTML5.
| Tag | Description |
|---|---|
| <form> | Defines an HTML form for user input |
| <input> | Defines an input control |
| <textarea> | Defines a multiline input control (text area) |
| <label> | Defines a label for an <input> element |
| <fieldset> | Groups related elements in a form |
| <legend> | Defines a caption for a <fieldset> element |
| <select> | Defines a drop-down list |
| <optgroup> | Defines a group of related options in a drop-down list |
| <option> | Defines an option in a drop-down list |
| <button> | Defines a clickable button |
| <datalist>New | Specifies a list of pre-defined options for input controls |
| <keygen>New | Defines a key-pair generator field (for forms) |
| <output>New | Defines the result of a calculation |
No hay comentarios:
Publicar un comentario