Aquí está el listado de los nuevos campos de formulario:

  •  color: selección de color
  • date: selección de fecha, adiós jcalendar!
  • datetime: fecha y hora
  • Time: sólo hora
  •  Month: mes del año
  • Week: semana del año, esto va para los alemanes 🙂
  • email: para rellenar más fácil un email en el movil
  • number: para rellenar más fácil un número
  • url: para rellenar más fácil una url en el movil
  • tlf: para rellenar más fácil un teléfono en el movil
  • search: típico campo de buscar
  • range: slider desplazador cuyo valor va entre min y max, y a pasos con step.
  • datalist: define un listado para un campo. http://www.w3schools.com/tags/tag_datalist.asp
  • file con opción de multiple

Nuevos atributos de campos de formulario:

  •  Required: campo requerido
  • Placeholder: nos permitirá colocar un texto predefinido en el valor del campo pero que al escribir el usuario se quita 
  •  Autofocus: campo que adquiere el foco
  •  Readonly: solo lectura
  •  Disabled: deshabilitado
  •  Pattern: validaciones por expresiones regulares
  •  Autocomplete: con off deshabilitamos el autocompletado del navegador
  •  Min max step: atributos de los tipo range, number y progress
  • label en option , para dejar ya el value 🙂

Práctica sugerida

Intenta usar estos nuevos tipos de campos en un formulario html5 y comprueba cómo se ven en Chrome, Firefox e Internet Explorer. Si tienes la posibilidad intenta verlo también desde un móvil.

Licencia Creative Commons