Create HTML5 forms and HTML5 forms

Create HTML5 forms and HTML5 forms

I. Common form labels are as follows:

(1) "type" attribute in <input>:

Check box-checkbox; single-choice button-radio; button-button; submit-submit;

(2) text fields

Row-cols; column-rows;

　　

<Form>	Form
<Input>	Input Field
<Textarea>	Text Field
<Label>	Control label
<Fieldset>	Definition domain
<Legend>	Domain Title
<Select>	Select list
<Optgroup>	Quota Group
<Option>	Options in the drop-down list
<Button>	Button

II. Application of common form tags

1. Create a user name and password form

(1) Main Code:

<Form>
Username: <input type = "text"/>
Password: <input type = "password"/>
<Br/>
</Form>

(2) effects:

 

2. Check box usage:

(1) Main Code:

<Form>
What fruits do you like? <Br/>
Apple <input type = "checkbox"/>
Tomato <input type = "checkbox"/>
Banana <input type = "checkbox"/>
Pineapple <input type = "checkbox"/>
</Form>

(2) effects:

 

3. Use of Single-choice buttons:

(1) Main Code:

<Form>

Select your gender:
Male <input type = "radio" name = "sex"/>
Female <input type = "radio" name = "sex"/>
</Form>

(2) effects:

 

4. Use of the drop-down list

(1) Main Code

<Form>

<Select>
<Option> www.baidu.com </option>
<Option> www.jikexueyuan.com </option>
<Option> www.google.com </option>
</Select>

</Form>

(2) Effects

 

5. Button usage

(1) Main Code

<Form>

<Input type = "button" value = "button"/> <br/> // "value" is used to define the value above the button.
<Input type = "submit"/> <br/>
<Input type = "reset"/> <br/> // "reset" is used to reset the content in the form.
</Form>

(2) Effects

<Textarea cols = "10" rows = "15"> Enter text here </textarea>

(2) Effects