Formularios en HTML5

1. Etiquetas de FormulariosFacilitador:
Duglas Moreno

2. Etiquetas de Formularios
HTML es un lenguaje de marcado cuyo propósito principal consiste en estructurar
los contenidos de los documentos y páginas web. Sin embargo, HTML también
incluye elementos para crear aplicaciones web. El estándar HTML/XHTML permite
crear formularios para que los usuarios interactúen con las aplicaciones web.
Mediante la etiqueta <form> y el <input> podemos empezar a diseñar nuestro
formulario, y crear algo como esto:

3. Etiquetas de Formularios
La etiqueta <form> nos permites, crear un formulario, en dichas etiquetas existen
atributos como:
1.- method se usa para indicar la forma de enviar los datos, su valores son post y
get, como por ejemplo: <form method='post' >
2.- action indica la URL que se encarga de procesar los datos del formulario, como
por ejemplo: <form action='ejemplo.php'>, donde ejemplo.php es el archivo donde
se enviaran los datos.
3.- enctype tipo de codificación empleada al enviar el formulario al servidor,
mayormente este atributo se usa cuando se adjunta archivos al servidor. Como por
ejemplo: <form enctype='multipart/form-data'>
Estas características, nos permite trabajar con los formulario de una manera eficaz,
como por ejemplo:

4. Etiquetas de Formularios

5. Etiquetas de Formularios
La etiqueta <input> nos permites crear las cajas de texto de diferente tipo, en las
cuales su atributo cambia. Como por ejemplo:
1.- text
2.- password
3.- hidden
4.- file
5.- checkbox
6.- radio
7.- submit
8.- reset
9.- image
10.- button
Indica el tipo de control
que se incluye en el formulario

6. Etiquetas de Formularios
Dentro de la etiqueta <input> tenemos atributos que nos permite configurar ciertas
opciones dentro de nuestras cajas de texto. Como por ejemplo los siguiente
atributos:
1.- name nos permite colocar el nombre de control a las cajas de texto, este
atributos nos permite conectar la caja con un lenguaje de programación.
2.- value este atributo, nos permite colocar una valor por defecto a nuestra cajas de
texto.
3.- maxlength este atributo indica el máximo numero de caracteres de una caja de
texto.
4.- readonly este atributo nos permite colocar las cajas en solo lectura.
5.- disabled con este atributo deshabilitamos las cajas de texto

7. Etiquetas de Formularios
Nos encontramos con otras etiquetas que nos permite, diseñar diferentes caja de
texto, como por ejemplo una de lista desplegable y de tipo memo, estas etiquetas
son: <select>, <textarea>, dichas etiquetas también usan atributos vistos
anteriormente.
A continuación veremos el uso de las diferentes cajas de texto:

8. Etiquetas de Formularios

9. Etiquetas de Formularios
Ejemplos de uso de algunas caja de texto

10. A trabajar......!