HTML5 Extra Features

HTML5 New Form Tags

This form demonstrates several new features of HTML5.

Working well on latest browsers.

  • Required-Include required attribute without quotation marks inside input tag. Not working on smart phones!
  • Email Input-Validates an email address. Works best in combination with the required attribute. Not working on smart phones!

Not fully functional

  • number
  • range
  • date
  • datetime
  • datetime-local
  • month
  • search
  • url

Form Example

Name:

This includes the new "required" attribute. The field will be required without using JavaScript.
E-mail address:

Will be validated in HTML5 browsers without JavaScript. To work properly, you must also include the "required" attribute. Otherwise, the input is only checked if there is actually something entered. The validation checks for text before and after the @, but it does not check for the period and the extension(.com)

 
Mailing address
City:
State:
ZIP:
Telephone:
HTML5 Experience: Beginner
Intermediate
Expert
Professional
Email List I would also like to receive emails about HTML5.
Years of Experience in Web Design
This uses the new input type called "number". It shows up as a spin box in Google Chrome,17.0.963.83, but other browsers show it only as an input field
Years of Experience in HTML

This uses the input type called "range". A slider shows up, but it doesn't really show what the values are until you actually submit the form. This does show up on smart phones, but you STILL cannot see the values you are choosing.
Comments:
  The following form input types are a part of HTML5, but only the Opera 11.0 browser displays these correctly at this time.
Pick a color.
Date
Time
Local Time
Month
Search Input
URL Validated Input

 

This form is set up as a demo, for instructional purposes only.