html初始网页布局常见有:标准流、浮动、定位。

  标准流:简单来说就是普通流、常规流,占位;

  浮动:就是从标准流中浮动出来;不占位;

  定位:也是从标准流脱离出来;不占位;

如果给个层级的话:标准流 > 浮动 > 定位。

今天主要记一下浮动元素的特点:

代码:float:left;或者:float:right;

只有左浮动和右浮动。

特点:

1. 脱标(脱离标准流),不占位置;

2. 元素浮动,后面标准流会上来把没浮动元素之前的位置占了,浮动元素会压住后面上来的标准流,不会对前面的标准流造成影响,如果不清除浮动的话,常常出现高度塌陷现象;

3. 浮动元素不会压住父元素的边框、内容和图片,只会围绕着浮动元素;

4. 浮动的元素顶对齐;

5. 浮动的元素设置宽高生效,具有行内块的特点;

6.  不能用text-align: center;因为脱标了所以盒子不能居中;