1. Form Definition
An HTML form is an area that contains form elements, and forms are created using the <form> tag
2. Form elements
1. Single-line text box <input type="text"/>. The default is text
<input type = “text” name=“名称”/>
The main properties of a single line of text are:
size: the width of the text box, the default is 20 characters wide
maxlength: The maximum character length of the input.
readonly: read-only, unchangeable value
disabled: Disabled. When the text box is disabled, it cannot get the focus. Of course, the user cannot change the value of the text box. And when submitting the form, the browser doesn't send the value of that textbox to the server.
2. Password box <input type="password"/>
<input type=“password” name=“名称”/>
3. Radio button <input type="radio"/>
<input type=“radio” name=“gender” value=“male”/>
4. Hidden field <input type="hidden"/>
<input type="hidden" name="hidden field"/>
Hidden fields are often used to submit information to the server that does not need to be displayed to the user.
5. File upload <input type="file"/>
When using file, the enctype of the form must be set to multipart/form-data, and the method attribute must be POST.
<input name="form" id="form" type="file" size="60" accept="text/*"/>
6. Drop-down box <select> tag
<select name="carlist"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="mer">Mercedes</option> <option value="audi">Audi</option> </select>
Volvo Saab Mercedes Audi
7. Multi-line text <textarea></textarea>
<textarea name=“textareaContent” rows=“ 20“ cols=“50” >
The cols="50", rows="15" attributes indicate the number of rows and columns, and the default display is 3.
8.<fieldset></fieldset>标签
<fieldset>
<legend>爱好</legend>
<input type="checkbox" value="篮球" />
<input type="checkbox" value="爬山" />
<input type="checkbox" value="阅读" />
</fieldset>
The fieldset tag divides the control into an area, which looks more regular.
9. Submit button <input type="submit"/>
<input type="submit"/>
10. Reset button <input type="reset"/>
<input type="reset" value="reset button"/>
When the user clicks the <input type="reset"/> button, the value in the form is reset to the initial value.
11. Normal button <input type="button"/>
A normal button is usually used to execute a piece of script code on click.
<input type="button" value="普通按钮"/>
12. Image button <input type="image"/>
use image as button
<input type="image" src="bg.jpg" />