web前端——表格和表单部分小知识

一、表格

表格的css属性

• | 相邻边框合并 | barder-collapse |

  barder-collapse : separate | 分开（默认）
  barder-collapse : collapse | 合并

• | 相邻表框之间的间距 | border-spacing |添加在table上面

• | 当表格没有内容时，是否显示表框区域 | empty-cells |

  empty-cells : hide | 隐藏
  empty-cells : show | 显示

• | 控制表格宽度的算法 | table-layout |

  table-layout : auto | 平均分配 （默认：根据内容多少来分）
  table-layout : fixed | 固定

• 数据行分组

  表头：thead
  表体： tbody
  表尾： tfoot
  一个表格只能有一个thead和tfoot，但可以包含多个tbody

• 数据列分组

  colgroup span=“把几列分成一组” /colgroup

• 列标题

  th

• 分割线

  rules=“groups” | 每一组
  rules=“all” | 每个单元格
  rules=“rows” | 每一行
  rules=“cols” | 每一列

二、表单

• 表单 | form |
• 表单控件 | input |

- 表单控件type

文本框 | text |
密码 | password |
重置按钮 | reset |
提交按钮 | submit |
空按钮 | button |
单选按钮 | radio |
多选按钮 | checkbox |
下拉列表 | select | 下拉列表选项 | option |
多行文本域 | textarea |
上传文本框 | file |

- 表单內常用标签

表单分组 | fieldset |
表单字段集标题 | legend |
提示标签 | lable |

- 属性补充

选中状态 | checked |
禁用 | disabled |

这是总结的关于 web前端——表格和表单 部分小知识