A partir de este post usaremos como navegador predeterminado Safary o chrome, esto debido a su mejor compatibilidad con las etiquetas de formularios de HTML 5
Lo primero sera saber que en las imágenes de l post anterior están los nombre de las nuevas etiquetas para formularios en HTML5, así que comencemos a describirlas.
Number
Los input creados con number solo admiten valores numéricos enteros y crean un cuadro de texto con botones de desplazamiento para cambiar la numeración a través de ellos, para un acceso mas rápido. Los atributos de los number son:
- max: Establece el valor máximo admitido
- min: Establece el valor mínimo admitido
- step: Indica la cantidad en la que se incrementara o decrementara el cuadro number
- requiered: Indica que este campo es obligatorio.
A continuación veamos una imagen de un formulario usando esta nueva clase de input
Date
Los tipos date se usan para ingresar fechas, su apariencia es igual a los number, solo que solo aceptan fechas, veamos un ejemplo de ello:
Datetime
Similar al anterior solo que ademas de la fecha se incluye la hora.
Time
Este es otro picker, solo que este permite seleccionar la hora
Range
Este input crea un control deslizante para seleccionar un valor numérico.
A todas las etiquetas input se puede agregar el atributo requiered, con el cual se convierten en obligatorios, con lo cual el formulario no se envía hasta que estén completos, tal y como vemos en la imagen
Otros
Hay otros tipos de input, pero estos son los menos soportados por los navegadores.
- url: para escribir direcciones de paginas web
- mail: para direcciones de correo electrónico
- search: para búsqueda en motores de búsqueda
Como siempre les dejo el enlace al archivo del ejemplo, recuerde que solo podrá verlo correctamente en safari y chrome
eso de id=»edad» por ejemplo para que es???
Me gustaMe gusta
el atributo id permite darle un nombre o identificador unico a cada etiqueta de html que coloques, como las etiquetas son elementos que colocas en una pagina web, puedes usar el id de la etiqueta para modificarla a traves de codigo javascript, asi por ejemplo podrias hacer un boton que cambie el color de un texto o el fondo de tu pagina, solo por dar unos ejemplos
Me gustaMe gusta