16、表格

CSS———表格————————属性

  • border——collapse——————设置是否把表格边框合并为单一的边框。
  • border——spacing—————— 设置分隔单元格边框的距离。
  • caption——side ——————— 设置表格标题的位置。
  • empty——cells ——————— 设置是否显示表格中的空单元格。
  • table——layout——————— 设置显示单元、行和列的算法。

1) border-collapse 规定是否合并表格边框。
separate 默认值。边框会被分开。不会忽略 border-spacing 和 empty-cells 属性。
collapse 边框会合并为一个单一的边框。会忽略 border-spacing 和 empty-cells 属性。

2) border-spacing 规定相邻单元格边框之间的距离。
如果定义一个数值，那么定义的是水平和垂直间距。
如果定义两个数值，那么第一个设置水平间距，而第二个设置垂直间距。

3) caption-side 规定表格标题的位置。
top 默认值。把表格标题定位在表格之上。
bottom 把表格标题定位在表格之下。

4) empty-cells 规定是否显示表格中的空单元格上的边框和背景。
hide 不在空单元格周围绘制边框。
show 在空单元格周围绘制边框。默认。

5) table-layout 设置用于表格的布局算法。
automatic 默认。列宽度由单元格内容设定。
fixed 列宽由表格宽度和列宽度设定。

  • 使用 border 属性设置表格边框。

  • 通过 width 和 height 属性定义表格的宽度和高度。

  • text-align 属性设置水平对齐方式，比如左对齐、右对齐或者居中

  • vertical-align 属性设置垂直对齐方式，比如顶部对齐、底部对齐或居中对齐

  • 为 td 和 th 元素设置** padding 属性，控制表格中内容与边框的距离**

修改表格位置：
table{
position: absolute;
top: 100px;
left: 20%;
}
修改caption：
table caption{
font-size:30px;
}