表格及表格而布局详解

15年前很火，table为何被淘汰

1. 性能不好
2. 不利于SEO
3. 加载完整个表格才会显示

表格元素的组成

特点：
dispaly:table 默认是块元素,并且包裹性（内容撑开宽度）
display:inline-table 对内块元素，对外行内元素

table的组成部分

1. caption 标题文字
   不在表格区域不需要添加边框线

2. thead 表格的表头

   tr>th
   tr行
   th 表头的单元格

3. tbody 表正文
   tr>td
   tr行
   td 正文的单元格
4. tfoot 表脚

th,td可以放什么

可以放文字,图片,视频,音频

通常情况下每个单元格会分割 每一个元素都有空隙2px

border-spacing: x y;每个单元格间隙
        第一个水平方向间隙  第二个竖直方向间隙

boder-collapse 
            1.separate 默认单元格分割
            2.collapse 单元格合并

表格默认特性

1.table可以设置宽高 tr/td近似均分
2.th默认加粗,水平垂直居中
3.td默认上下居中  左对齐
4.一列的宽度,由该列最宽的单元格内容决定
5.一行的高度,由该行最高的单元格的内容决定
6.th,td没有margin(调整元素间的间距)
7.支持margin:0 auto;

单元格合并

rowspan 当前单元格向下横跨单元格的行数
colspan  当前单元格向右横跨单元格的列数