Wednesday, March 16, 2016

HTML5 Forms Elements

Now a days almost every one visit a website, at least one in the day. And we find sign-up form, registration form or inquiry form on almost every websites. These forms are generally created in HTML in beginning and in now a days HTML5 is widely used to create form. Because In HTML5 forms some elements are new and its very useful.
 
One of the best things about HTML5 forms is that we can use almost all of these new input types and attributes right now. They don’t even need any shivs, hacks, or workarounds. That isn’t to say they’re all “supported” right now, but they do cool things in latest browsers that do support them-and degrade gracefully in browsers that don’t understand them. 

New input types:

There are the some input types in HTML5. In these input types, few are directly connected to be displayed in the web browser, where remain are more useful for there semantic value and/or connected to validation of them. The main advantage input types too is that if it’s not supported in all web browser, it will default back to a regular <input type=”text”> element: no errors, no multiple code versions to handle.
 
Below are Some New Input Types in HTML5:
  1. Color: Gives the end user a native color picker to choose a color.
Exp: <input type="color" value="#b97a57">
  1. Date: Offers a datepicker.
Exp: <input type="date" value="2016-11-07">
  1. Date time: An useful element to select both time and date.
Exp: <input type="datetime" value="2016-12-09T21:22:34.31">
  1. Datetime-local: An useful element to select both time and date, with local settings support.
Exp: <input type="datetime-local" value="2016-02-07T21:52">
  1. Email: It's a field for enter e-mail id(s).
Exp: <input type="email" value="raj@admecindia.co.in">
  1. Month: Used to select a complete month.
Exp: <input type="month" value="2016-25">
  1. Number: Use to insert a number
Exp: <input type="number" value="8">
  1. Range: It's Offers a slider to set to a particular position.
Exp : <input type="range" value="26">
  1. Search: A field, which is used for search queries.
Exp : <input type="search" value="[any search text like (admec multimedia institute)]">
  1. Tel: used to selecting a telephone number.
Exp : <input type="tel" value="[Any integer value]">
  1. Time: for keep certain time.
Exp : <input type="time" value="11:21">
  1. URL: Used to Insert a URL.
Exp : <input type="url" value="admecindia.co.in">
  1. Week: selecting a particular week.
Exp : <input type="week" value="2011-W24">
As you can seen In above mention topics with all the new input types, attributes a lot of the things we spent countless hours on implementing before will be native in web browsers, saving us a lot of work and offering users something extremely well tested and implemented. HTML5 really invoked a revolution on the web design and web development with open standards to try and meet all the needs of developers, and it is all implemented in a very fast pace.

No comments:

Post a Comment