【基础知识03】布局方式汇总

一、 传统网页布局(PC端网页布局)

1、标准流：

简单说，标签按照默认的排列方式在页面上显示效果

2、浮动

3、定位

二、移动端布局

1、flex弹性布局

在不考虑浏览器兼容性问题时，flex弹性布局也可以应用于pc端网页布局之中。

2、流式布局（百分比布局）

1.简介：

元素宽度设置百分比的形式，高度设置固定的px、rem等；从而实现，元素随着显示设备的宽度变化，而产生相应变化，但是高度不会改变情况；

2.说明：

在Web1.0（PC发展早期），盛行流式布局，对网页要求不高，所以高度没有实现自适应变化；但是现在已有更成熟的技术替代流式布局，所以流式布局仅供了解，不做重点掌握；

3、rem适配布局

4、响应式布局

移动端布局中不同的布局会有不同的效果，没有哪一种是最简单、最好的。只有哪一种场景会更可能的适合哪一种布局。