千锋前端浠浠呀老师HTML+CSS教程，零基础web前端开发入门必看视频
表格：
主要用来向用户展示数据
语法：
<table> ----------------- 表格
<tr> ---------------- 表格行
<td></td> ------- 单元格
</tr>
</table>
表格的标签属性：（写在表格标签中）
1、设置宽度
width=“”
2、设置高度
height=“”
注意：宽高取值可以写px也可以不写，也可以是百分数
3、设置边框
border=“1”
4、背景颜色
bgcolor=""
5、表格水平对其方式
align=“”
取值：left/right/center
6、边框颜色
bordercolor=""
7、表格外边周围的线如何显示
frame=""
取值：
box ----------- 外边四周的线都显示
above ----------- 外边上面的线显示
below ----------- 外边下面的线显示
lhs ----------- 外边左侧的线显示
rhs ----------- 外边右侧的线显示
8、表格里面的线如何显示
rules=“”
取值：
rows ----------- 里面只显示横着的线
cols ----------- 里面只显示竖着的线
9、内容到单元格边框距离
cellpadding=""
10、单元格与单元格间距
cellspacing=""
表格行标签属性：（写在行标签上）
1、设置高度
height=""
2、背景颜色
bgcolor=""
3、一行内文本水平对齐方式
align=""
取值：left/right/center
4、一行内文本垂直对其方式
valign=""
取值：top/bottom/middle
表格单元格标签属性：（写在单元格标签上）
1、设置宽度
width=""
2、设置高度
heigh=""
3、背景颜色
bgcolor=""
4、文本水平对其方式
align="left/right/center"
5、文本垂直对其方式
valign="top/bottom/middle"
!重点属性
6、合并行
rowspan=""
7、合并列
colspan=""
表格的CSS属性：
1、table上的css属性
1、边框
border:1px solid red;
2、单元格与单元格间距
border-spacing:
3、合并表格边框为一条细线
border-collapse: collapse;
4、表格的布局算法
table-layout:
取值：
auto ------------ 自动布局
表示单元格的宽度随内容变化
fixed ----------- 固定布局
表示将单元格的宽度固定
2、td上的css属性
1、内容到单元格间距
padding
2、隐藏内容为空单元格
empty-cells:
取值：
show --------- 显示内容为空单元格
hide --------- 隐藏内容为空单元格
表格中的其他标签：
1、表格标题
<caption>标题</caption>
放置在第一行前面
更改标题位置：caption-side:top/bottom
2、行分组标签
thead 表格头部
th标签中文本默认水平居中，并且自带加粗效果
tbody 表格主体
tfoot 表格尾部
3、列分组标签
<colgroup span="数值"></colgroup>
span表示将几列划分为一组
表单：
作用：用来收集用户信息，提交到后端
<form action="提交地址" method="提交方式"></form>
表单元素：
input type属性的取值
1、text -------- 文本输入框
2、password ----- 密码框
3、submit ------- 提交按钮
4、reset -------- 重置按钮
5、button -------- 普通按钮
6、file ---------- 上传文件
7、hidden -------- 隐藏域
8、image --------- 图片按钮
本质就是一个提交按钮
9、radio --------- 单选按钮
注意：默认情况下可以实现共选，想要实现单选，需要给同一组单选添加相同的name属性以及取值
添加checked属性实现默认选中效果
为了提高用户体验，实现点击文字即可选中效果，需要借助label标签，需要保证label标签中for属性的取值与input标签中id属性取值相同
例如：
<input type="radio" name="sex" id="boy">
<label for="boy">男</label>
10、checkbox ------ 复选框
同上单选按钮
让表单元素处于禁用状态，添加disabled属性
下拉列表：
<select>
<option value=""></option>
</select>
selected:
实现默认选中效果，在option标签上添加selected属性
multiple:
实现多选效果，在select上添加multiple属性，默认情况下显示4个下拉列表项
size:
控制下拉列表显示列表项个数，在select上添加size属性
size=""
文本域（多行文本输入框）
<textarea name="" id="" cols="30" rows="10"></textarea>
cols控制文本框的宽度
rows控制文本框的高度
实际开发中，我们在css中去设置文本框的宽高
默认情况下，文本框宽高用户可拖拽，取消拖拽需要使用resize
resize：
取值：
both -------- 可以拖拽
vertical -------- 垂直方向拖拽
horizontal -------- 水平方向拖拽
none -------- 不可以拖拽（常用）
注意：文本域标签中可以识别空格和回车
表单的提交方式：
属性：method
取值：
get -------- 明文提交，所提交的数据在地址栏能够看到，不安全，提交数据大小又限制(默认提交方式)
post ------- 加密提交，更安全，提交数据大小没什么限制
表单的其他标签：
1、表单字段集
<fieldset></fieldset>
主要用来实现表单元素进行分组
2、表单字段集标题标签
<legend></legend>
-->
