Shulou(Shulou.com)06/03 Report--

This article mainly introduces "what new INPUT input types do HTML5 have". In daily operation, I believe many people have doubts about what new INPUT input types HTML5 has. Xiaobian consulted all kinds of data and sorted out simple and easy-to-use operation methods. I hope it will be helpful to answer the doubts about "what new INPUT input types HTML5 has". Next, please follow the editor to study!

An example of an existing input type HTML code:

The code is as follows:

Text field

Radio button

Check box

Drop-down list

Password field

Submit button

You can click the button

Image button

Hidden domain

Reset button

File domain

In HTML5, several new form input input types have been added, and better input control and validation can be achieved by using these new elements.

1. Application of email type

The input element of type email is a text input box dedicated to entering an E-mail address, and the value of the email input box is automatically validated when the form is submitted.

The code is as follows:

2. The application of url type

The input element of type url provides a text box for entering special text such as url addresses.

The code is as follows:

3. The application of number type

The input element of type number provides a text box for entering numeric values.

The code is as follows:

4. Application of range type

The input element of type range provides a box for entering worthy text containing a range of numbers, which is displayed as a scroll bar in a web page.

The code is as follows:

5. Application of date check-out type

Input type HTML code function description

The code is as follows:

Date

Select day, month and year

Month

Select month and year

The code is as follows:

Week

Select Zhou and year

The code is as follows:

Time

Select time (hours and minutes)

The code is as follows:

Datetime

Select time, day, month, year (UTC time)

The code is as follows:

Datetime-local

Select time, day, month, year (local time)

6. Application of search type

The input element of type search provides a text box for entering search keywords.

The code is as follows:

Input [type= "search"] {

-webkit-appearance:textfield

}

7. Application of tel type

The input element of type tel provides a text box specifically for entering phone numbers.

The code is as follows:

8. Application of color type

The input element of type color provides a text box specifically for setting colors.

The code is as follows:

At this point, the study on "what new INPUT input types are added to HTML5" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.