Conceptual understanding
A complete form consists of three parts:
Form controls (form elements)
Tips
Form fields
( 1 ) search box / domain registration window / website login window
form --- the form field
URL action --- data processing URL / form submission
method --- submission (get- easy to transfer small amounts of data, poor privacy / post safe, transfer large volumes of data, privacy is good)
input --- single table, there are many types (tupe), set a different type (type) can implement different functions
text --- textbox
textarea --- text field
submit submit ---
Table single name --- name of the data collected
Value-- form item values, indicated with the text in the text box
readonly-- read-only, read only text in the box, can not be changed
The width of the text box size ---
maxlength --- maximum character length
Disable disabled ---
(2) the password box
<input type="password" name="***">
( 3 ) radio button
<input type="radio" name="***" value="***">
Example: Gender: <INPUT type = " Radio " name = "Gender"> M
<input type="radio" name="gender" >女
If a Radio set, they must be given to the same name, which can select a plurality of
Note:
* Radio button corresponding to the name of the same name requirements
* <Lable> tag
For radio buttons and two-way selection button, click on the text can also be selected to improve the user experience, the choice of a radio button, the button can be avoided only point in the selected state.
input element is defined as a mark
Role: for a binding form elements, click on the label when the label when bound form elements will get the input focus (improving user experience)
<Label> Username: <input type = "text"> </ label> ---- when the mouse clicks the user name, enter the cursor automatically appears in the text box
Two way, with compatibility issues, choose one:
1.包含所有内容-------<lable><input type="radio" name="gender" value="femal">女</lable>
2.部分包含----- <input type="radio" name="gender" value="femal" id="nv"><lable for="nv">女</lable>
(4) radio button (check box)
<input type="checkbox" name="***" value="***">
Checked = checked is selected by default (Required)
( 5 ) upload files
<input type="file" name="***" >
( 6 ) the drop-down menu
<select name="***">
<Option value = "***"> </ option> (Option written content)
</select>
( 7 ) multi-line text
<Textarea rows = "number of characters per line" cols = "number of lines displayed" name = "***">
Text content
</textarea>
( 8 ) button
Submit button: <input type = "submit" value = "Submit" /> Submit feature
Reset button: <input type = "reset" value = "reset" /> Reset Content
Push buttons: <input type = "botton" value = "normal" /> no function, the function can customize
Picture button: <input type = "image" src = "***" /> submit feature