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

This article mainly introduces the relevant knowledge of "what is the type attribute of the input tag in the web front-end development". The editor shows you the operation process through an actual case, the method of operation is simple and fast, and is practical. I hope that this article "what is the type attribute of the input tag in the web front-end development" can help you solve the problem.

1. Single-line input box

. Single-line text input boxes are often used to enter simple information, such as user name, account number, and so on. Specific attributes are: name, value, maxlength.

2. Password input box. Its contents are displayed in the form of dots.

3. Optional button. Radio buttons are used for single selection. When defining a radio button, you must set the same name value for the options in the same group. You can apply the checked property to the radio button to set the default check.

4. Check box. The check box is used for multiple selections, or you can apply the checked attribute to it.

5. Ordinary button. Try using normal buttons with the JavaScript scripting language.

6. Submit button. Submit button when the core space in the form, users generally need to submit after the completion of information entry can be completed, you can use the value property to change the default text on the submit button.

7. Reset button. When the user typed incorrectly, click the recharge button directly to cancel to enter the information, you can use the value attribute to change the default text on the recharge button.

8. Submit button in image form. The image submit button proxies the default button with the image, and its function is the same as that of the submit button. It is important to note that the url address of the image must be specified for its definition scr attribute.

9. Hidden domain. Hidden domains are invisible to users and are usually used for background programs.

10. File domain. When defining a file domain, a select file button and a message message will appear on the page, and the user can click the button and directly select the file to submit the file to the background server.

11. Emai type. The emai type tag is a text input box dedicated to entering an e-mail address to verify that the contents of the emai input box conform to the e-mail address format. An error message is prompted.

12. Url type. This is a text box dedicated to entering an url address. And check the input.

13. Tel type. Used to enter phone numbers, the general tel type is usually used in conjunction with the pattern attribute.

14. Search type. A text box dedicated to entering search keywords, which can automatically record some characters. After the user enters the content, there will be a delete icon on the right side, which can quickly clear the content.

15. Color type. Can be used to provide design color text box, the user to achieve a RGB color input. Its basic form is # RRGGBB, the default value is # 000000, and the default color can be changed through the value of the value property. Click the color type text box to quickly open the color picker panel, making it easy for users to visually select colors.

16. Number type. Lets you enter a well-known text box. And check whether the input is a number. In addition, you can add other properties, vale sets the initial value of the input box, max/min limits the maximum and minimum value of the input box, and sep enters a legal number interval, if the default value is not set to 1.

The attributes of the tag are not only these, including the limited date, time, and so on. If the browser does not support the tag input type, it will be displayed as a normal input box in the web page. As a front-end engineer, the current rate of tags is very high.

This is the end of the content about "what is the type attribute of the input tag in web front-end development". Thank you for reading. If you want to know more about the industry, you can follow the industry information channel. The editor will update different knowledge points for you every day.

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.