五、CSS中表格-表单 相关知识点（部分，易忘，）文本域

五、表格-表单

1、表格

caption表格标题、thead表头区域、 tbody表体区域、 tfoot脚部区域

① tr：英文全称是＂tablerow＂，表格中的行。

② td：英文全称是＂tabledatacell＂，是“表体单元格”。

③ th：英文全称是＂tableheadercell＂，是“表头单元格”。

caption td th :内部可以嵌套任何标签

2、表格常用属性

（1）表格属性

border=””边框、cellpadding=””边框与内容的距离

cellspacing=”0”边框与边框间的距离0，边框没有合并;

如果边框为 1px, 那么单元格挨着的部分看到效果是2px

align=”方位词” 表格整体居方位词

（2）表格单元格合并单元格

① colspan 跨列合并

②rowspan 跨行合并

/* css设置表格边框时, th  td也要设置 */    这里的边框合并了，如果边框为1，几个单元格挨着部分边框也是 1px

table,th,td{

border: 1px solid blue; }

设置细线边框

table{  border-collapse: collapse; }

3、表单（form）

（1）input输入框type类型

<input type=”” value=”” placeholder=”” checked=””>

①type的值很多，不同值代表input是不同属性的，

type的值有：text文本 password密码 radio单选框 checkbox复选框 submit提交按钮 image图片按钮

reset重置按钮 file文件上传 button普通按钮

<button></button>提交按钮

(2)input的属性相关

①name如果想要单选框按钮radio实现多选一，name的值要一样value表单默认值 、placeholder提示占位词 、checked选中

②placeholder 提示占位词、checked radio按钮和checkbox按钮的默认选中状态

(3)下拉选择 

① <select>

<option> 内容 </option>

<option selected> 内容</option> selected默认选中展示

</select>

②<label>这里放多个标签在浏览器中点一个也可以选中</label>关联标签

（4）textarea 文本域

textarea{ resize:none； } 文本域框右下角禁止进行拖拽