Home >Web Front-end >HTML Tutorial >HTML form tag usage

HTML form tag usage

小云云
小云云Original
2018-01-26 11:19:406946browse

Generally, the d5fd7aea971a85678ba271703566ebfd tag is used in forms to collect user input information. The input type is determined by type. The most commonly used form tag is the input tag (d5fd7aea971a85678ba271703566ebfd). Input types are defined by the type attribute (type). Common input types include text fields, radio buttons, check boxes, drop-down menus, etc.

Forms in HTML can be used to collect various types of input information from users. A form is actually an area containing form elements. The input information of various elements in this area will eventually be submitted to the program script through the form. For example, common ones include user login, registration, publishing articles, etc., which are all submitted to dynamic programs for processing through forms. This section mainly talks about forms and form elements. How to submit form information to dynamic programs will be discussed in future programming language lessons.
The area of ​​the form uses the ff9c23ada1bcecdd1a0fb5d5a0f18437 tag to define the scope of the form. The value of the element in ff9c23ada1bcecdd1a0fb5d5a0f18437f5a47148e367a6035fd7a2faa965022e will be submitted to the corresponding address through this form.
Text field
The text field can provide users with the function of inputting text. The browser will interpret the text field as a rectangular box. The user moves the cursor to the box and clicks. The cursor can be moved into the frame. Users can type letters, numbers, etc. into the form.
The text field is defined by setting the text value for the type attribute in the d5fd7aea971a85678ba271703566ebfd tag


##XML/HTML Code Copy content to clipboard

  1. ##61d1e85630d4f9e4723603239e22dfcf
  2. Text field 1:
  3. 25a6df1d6facfdb611338fd027400dfe
  4. Text field 2:
  5. b5e7cf2348cb644f498a6eb2af18d7d5
  6. ##a1e22cab2b4b36ab2e80100d3eff2b46 The browser displays as follows:


201678135308382.png (296×89)Radio button

Radio button in most cases Appears in the options for users to enter information when registering. This type of multi-user only allows users to select one result. The radio button is defined by setting the value of the type attribute to radio in the d5fd7aea971a85678ba271703566ebfd tag.

<form>
<input type=”radio” name=”sex” value=”male” /> 男生   
<input type=”radio” name=”sex” value=”female” /> 女生   
</form>

  1. The display in the browser is:


201678135342504.png (164×77)Check box

Checkboxes allow users to select one or more options. A common one is to provide users with functions such as remembering their login account when they log in. You can also collect multiple opinions from users on the user survey page. The check box is defined by setting the value of the type attribute to checkbox in the d5fd7aea971a85678ba271703566ebfd tag

<form>
<input type=”checkbox” name=”val1″ />
前端开拓者不错   
<input type=”checkbox” name=”val2″ />
前端开拓者一般   
</form>

  1. The browser displays as follows:


201678135409883.png (203×92)Drop-down menu

The drop-down menu is similar to the radio selection in information selection, but the drop-down menu can accommodate more information. And the dropdown menu can execute additional scripts after selecting the menu value. The drop-down menu starts with 221f08282418e2996498697df914ce4e, and each option tag in the select tag is a value in the drop-down menu.

<form>
<select name=”cars”>
<option value=”volvo”>Volvo</option>
<option value=”saab”>Saab</option>
<option value=”fiat”>Fiat</option>
<option value=”audi”>Audi</option>
</select>
</form>

  1. The browser displays:


201678135442039.png (149×83)Submit button

The submit button is every A necessary part of the form. After the user has entered the corresponding information, he needs to click the submit button to trigger the action and submit the form values ​​to the next page. When the action attribute in the ff9c23ada1bcecdd1a0fb5d5a0f18437 tag sets the corresponding submission address, the submit button will submit all the data obtained in the form to the page at this address. The submit button is defined by setting the value of type to submit in the input tag. The following is an example of the search box of the front-end developer, setting the submission address as the search page.

<form name=”input” action=”http://www.frontopen.com/” method=”get”>
关键字:   
<input type=”text” name=”s” id=”s” />
<input type=”submit” value=”搜索” />
</form>

  1. The browser displays the following:

Conclusion: This section only provides a basic demonstration and explanation of commonly used form front-end layout elements. Real form applications are mostly used in server programming languages, and more parameters and rules need to be set. In this lesson, you only need to understand how to arrange the elements of the form. In most cases, you can basically cooperate with the background programmer to complete website development.

Related recommendations:

Detailed explanation of HTML Form form elements

JQuery form verification whether the radio button box is selected Experience summary

WeChat applet simply implements form form to obtain input data example sharing

The above is the detailed content of HTML form tag usage. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn