1、文档流（流式）布局

最基本的布局，按照文档顺序一个个显示，块元素独占一行，行内元素共享一行

2、表格布局

3、定位布局

使用position属性
relative定位原则：无侵入性

4、浮动布局

使用float 属性，使元素脱离文档流

5、flex布局

display：flex

6、Grid布局

设定Grid布局后 ，容器内自元素 float ，clear，inline-block table-cell vertical-align column-*都会失效

7、圣杯布局、双飞翼布局

三栏布局，两边定宽中间自适应

8、两列布局