HTML入门教程第十节
列表，表格与表单
一、列表
列表的作用：布局内容排列整齐的区域
无序：布局排列整齐的不需要规定顺序的区域，标签ul嵌套li，ul是无序列表，li是列表条目
ul标签里只能包含li标签，li标签里面可以包含任何内容
有序：布局排列整齐的需要规定顺序的区域，标签ol嵌套li，ol是无序列表，li是列表条目
ol标签里只能包含li标签，li标签里面可以包含任何内容
定义列表：标签dl嵌套dt和dd，dl是定义列表，dt是定义列表的标题，dd是定义列表的描述/详情。dl里面只能包含dt和dd，dt和dd里面可以包含任何内容
二、表格
标签：table嵌套tr，tr嵌套td/th
标签名 说明
table 表格
tr 行
th 表头单元格
td 内容单元格
表格结构标签（了解）：用表格结构标签把内容划分区域，让表格机构更清晰语义更清晰
thead 表格头部 表格头部内容
tbody 表格主体 主要内容区域
tfoot 表格底部 汇总信息区域
三、合并单元格
将多个单元格合并成一个单元格，以合并同类信息（跨行合并，跨列合并）
合并单元格的步骤：
明确合并到目标
保留最左最上的单元格，添加属性（取值是数字，表示需要合并的单元格数据），跨行合并，保留最上单元格，添加属性rowspan；跨列合并，保留最左单元格，添加属性colspan
删除其他单元格
四、表单
作用：收集用户信息。
使用场景：登录页面，注册页面，搜索区域
1.input标签
<input type="text"> ''''引号内为属性值
type属性值 说明
text 文本框，用于输入单行文本
password 密码框
radio 单选框
checkbox 多选框
file 上传文件
2.input标签占位文本
<input placeholder="提示信息">
文本框和密码框都可以使用
3.单选框radio
常用属性：
属性名 作用 特殊说明
name 控件名称 控件分组，同组只能选中一个（单选功能）
checked 默认选中 属性名和属性值相同，简写为一个单词
<input type="radio" name="gender" checked>男
<input type="radio" name="gender">女
4.上传文件file
默认情况下，文件上传表单控件只能上传一个文件，添加multiple属性可以实现文件多选功能
<input type="file" multiple>
5.下拉菜单
标签：select嵌套option，select是下拉菜单整体，option是下拉菜单的每一项，selected是默认选项
name和id是用来给后台发送数据的选项，现在先不用
<select name="" id=""></select>
6.文本域
作用：多行输入文本的表单控件
textarea双标签，name="" id="" cols="30" rows="10"给后台发送数据用和设置尺寸用，一般用css设置尺寸，现在不用，里面输入默认提示文字
<textarea name="" id="" cols="30" rows="10"></textarea>
7.label标签
作用：网页中，某个标签的说明文本
<label for=""></label>
经验：用label标签绑定文字和表单控件的关系，增大表单控件的点击范围，提升用户体验
增大点击范围写法一：
label标签之包裹内容，不包裹表单控件
设置label标签的for属性值和表单控件的id属性值相同
<input type="radio" id="man">
<label for="man">男</label>
写法二：
使用label标签包裹文字和表单控件，不需要for属性，删掉
<label><input type="radio" name="gender" id="female">女</label>
提示：支持label标签增大点击范围的表单控件：文本框，密码框，上传文件，单选框，多选框，下拉菜单，文本域等
8.按钮
<button type="button">按钮</button>
type属性值
submit 提交按钮，默认功能，点击数据提交到后台
reset 重置按钮，点击后恢复表单控件默认值
button 普通按钮，默认没有功能，可以配合js使用
9.无语义的布局标签
作用：布局网页（划分网页区域，摆放内容）
div 大盒子，双标签
span 小盒子，双标签
10.字符实体
空格  
<<
>>
