table of Contents
3.3.1 Form fields and their attributes
3.3.2 Form controls (form elements)
Preface
This article mainly records HTML-related knowledge points, followed by HTML (2) HTML tags (top) , and will be updated continuously. If there is an error, please give some advice.
3.html tag (below)
3.1 Form label
The table is mainly used to display data , making the data more intuitive and standardized .
<table>
<tr> <th> </th> <th></th > </tr>
<tr> <td> </td> <td></td> </tr>
<tr> <td> </td> <td></td> </tr>
<tr> <td> </td> <td></td> </tr>
<tr> <td> </td> <td></td> </tr>
</table>
3.1.1 Components
- form
<table></table>
- Row
<tr><tr>
- Cell
<th></th> <!--表头单元格,加粗居中-->
<td></td> <!--普通单元格-->
3.1.2 Table Properties
- position
align=" left/center/right"
- frame
border="0无/1有"
- The distance between the content and the border
celllpadding="像素值"
- Border spacing
sellspacing="像素值"
- Table height
hight="像素值"
- Table width
width="像素值"
3.1.3 Table structure label
Used to distinguish the header from the body , making the structure clearer
- Header
<thead></thead>
- Table body
<tbody></tbody>
3.2 List tags
3.2.1 Unordered List
There is no requirement for the order of the elements in the table , which is more commonly used
<ul>
<li></li>
<li></li>
<li></li>
</ul>
note:
<ul><ul> can only contain <li></li> elements, not other elements. If you want to place other elements, you can only place them in <li></li>.
3.2.2 Ordered List
There are order requirements for the elements in the table , not commonly used
<ol>
<li></li>
<li></li>
<li></li>
</ol>
<ol><ol> can only contain <li></li> elements, not other elements. If you want to place other elements, you can only place them in <li></li>.
3.2.3 Custom list
Suitable for explanation and description of terms
<dl>
<dt></dt>
<dd></dd>
<dd></dd>
<dd></dd>
</dl>
<dl></dl> can only contain <dd></dd> elements and cannot contain other elements. If you want to place other elements, you can only place them in <dd></dd>. -0
3.3 form tags
3.3.1 Form fields and their attributes
- Form field
<form></form>
- Attributes
action="url地址" method="post/get" name="表单名"
3.3.2 Form controls (form elements)
(1) <input> control
- type attribute
type=""
text <!--文本输入框-->
password <!--密码框-->
radio <!--单选框-->
checkbox <!--复选框-->
submit <!--提交按钮-->
reset <!--重置按钮-->
button <!--普通按钮-->
file <!--文件按钮-->
- name attribute
name="控件名称"
用于区别不同表单控件
必须定义在type属性之后
单选框和多选框的属性值必须一样
value attribute
规定input的初始值
- checked attribute
当input打开时的默认选项
主要针对于单选和复选框
- maxlength attribute
用于规定输入文本的最大长度
- label attribute
将文本与表单元素(主要是单选、复选、文本输入框)绑定,增加用户体验
<label for ="123" > 内容</label>
<input type="text" id="123">
(2) <select></select> drop-down control
<select>
<option>选项一</option>
<option>选项二</option>
<option>选项三</option>
</select>
(3) <textarea></textarea> text field control
- cols attribute
- rows attribute
I have sorted out the HTML mind map a bit, and interested friends can pick them up. Not much to say, the link is as follows:
Link: https://pan.baidu.com/s/1bXNOqhBqhhR1iJl-ICA8jg Extraction code: bl7x