HTML学习笔记（二）标签（下）

一.表格标签

1.主要作用：显示、展示数据

2.基本语法：
<table></table>用于定义表格的标签
<tr></tr>用于定义表格中的行，必须嵌套在<table></table>中
<td></td>用于定义表格中的单元格，必须嵌套在<tr></tr>中

3.表头标签<th></th>:加粗，居中显示

4.表格属性
相对周围元素的对齐方式：align
规定表格单元是否拥有边框：border
规定单元格边沿与其内容之间的空格：cellpadding
规定单元格和单元格之间的空隙：cellspacing
规定表格大小：<width>,<height>

5.表格结构标签：<thead>(表头),<tbody>（主体区域）

6.合并单元格
（1）合并
跨行合并：rowspan="合并单元格的个数"
跨列合并：colspan=“合并单元格的个数”
（2）目标单元格
跨行：最上侧单元格为目标单元格
跨列：最左侧单元格为目标单元格
（3）合并单元格三部曲
先确定跨行还是跨列合并->找到目标单元格，写上合并方式->删除多余的单元格

二.列表标签

列表是用来布局的
1.无序列表（重要）
语法格式<ul> <li>... </li>...</ul>，自动加小黑点
注意：无序列表各个列表项没有顺序之分，<ul>中只能放<li>标签，<li>中可以放任意标签

2.有序列表
语法格式：<ol><li>...</li>...</ol>，自动加序号
注意：无序列表各个列表项有顺序之分，<ol>中只能放<li>标签，<li>中可以放任意标签

3.自定义列表
使用场景：对于术语和名词进行解释和描述，定义列表的列表项前没有任何项目符号(大哥带着小弟)
基本语法：<dl> <dt>...</dt> <dd>...</dd>...</dl>，<dt>和<dd>里面可以放任何标签
注意：<dl>中只能放<dt>和<dd>标签，一般一个<dt>对应多个<dd>

三.表单标签

1.为什么需要表单：收集用户信息

2.组成：表单域、表单控件、提示信息

3.表单域：<form>包含表单元素的区域，它会把它范围内的表单元素信息提交给服务器
语法格式<form action = "url地址" method = "提交方式 " name = "表单域名称" >... </form>

4.表单控件（表单元素）
①input输入表单元素：
<input type = "属性值“ name =" 表单元素名字" value ="表单元素的值" checked="checked"(规定input元素首次加载时应当被选中) maxLength="输入的字符的最大长度" />(单标签)

属性值：
button：按钮，多数情况下使用JS脚本搭配使用
submit：提交按钮，把表单数据发送到服务器
reset：重置按钮，还原表单元素的初始状态
file：文件按钮，上传文件使用
password：定义密码字段，该字段中字符被掩盖
text: 单行的输入字段，用户可以在其中输入文本
radio：单选按钮，实现多选一，单选按钮必须由相同的名字name，value值不同，才可以实现多选一
checkbox：多选框，必须有相同的名字name，不同的value，实现多选的效果

注意：label标签：为input元素定义标注
语法规范：<label for ="text"> <input type="text" id="text">

②select下拉表单元素
使用场景：有多个选项让用户选择，并且想要节约页面空间
语法规范：<select> <option>...</option>...</select>
注意：<select>中至少含有一对<option>,在<option>中定义selected= "selected"时，当前项即为默认选中项

③textarea文本域元素
使用场景：当用户输入的内容较多的情况下，使用<textarea>标签
语法规范：<textarea rows="显示的行数" cols ="每行的字符数">...</textarea>