css布局的三种机制

css布局的三种机制

CSS 布局的 3 种机制分别是普通流（标准流）、浮动和定位。

①普通流（标准流）

（1） 块级元素会独占一行，从上向下顺序排列；

常用元素：div、hr、p、h1~h6、ul、ol、dl、form、table

（2） 行内元素会按照顺序，从左到右顺序排列，碰到父元素边缘则自动换行；

常用元素：span、a、i、em等

②浮动

让盒子从普通流中浮起来,主要作用让多个块级盒子一行显示。

③定位

将盒子定在浏览器的某一个位置——CSS 离不开定位，特别是后面的 js 特效。

div css布局是什么

div+css布局是HTML通过div标签与css样式表开发制作网页的方法名称。CSS+DIV是网站标准中常用的术语之一，通常为了说明与HTML网页设计语言中的表格（table）定位方式的区别。

CSS+DIV是网站标准（或称“WEB标准”）中常用的术语之一，通常为了说明与HTML网页设计语言中的表格（table）定位方式的区别，因为XHTML网站设计标准中，不再使用表格定位技术，而是采用css+div的方式实现各种定位。

css布局乱怎么办

一般的解决方案。采用定长定宽的布局。规划好页面的各部分元素大小。精确到px。然后整体居中，两侧留白。这样分辨率不一样，只会影响留白部分的大小。居中部分在各分辨率下显示效果一致。

另一种解决方案比较少用。就是采用流式布局。页面的各部分都是按照百分比去设置的。这样分辨率不一样的情况下。效果都是一致的。但是比较难以掌控。编码难度大，测试困难。因此较少采用。

另外，针对不同移动设备下，不同分辨率通常采用服务端判断设备类型，然后加载相应css去实现不同设备访问自适应