版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/z_x_Qiang/article/details/82561797
浮动模块
布局模式分为三种：普通流（标准流）、浮动和定位；
1.普通流（标准流）
在此之前讲的布局都是普通流，块级元素竖行排列，行内元素水平排列；
2.浮动
目的：浮动的主要目的是将多个块级元素通行显示；
特点：
1.可以通过显示样式转换，转换成行内块元素显示，但是缺点是在各个块元素之间会有缝隙存在；
2.浮动就是将块元素浮起来，不占位置；然后下面的元素就会上移动抢位置；这样的话就失去了布局的意义了，所以往往是要在浮动的元素外面套一个块元素站位；里面的元素就可以做浮动效果了；
3.如果要一行显示所有的块，则这些块都要使用浮动属性才行；
4.浮动可以使得块元素变成行内块元素，可以使得行内元素也变成行内块元素；
3.定位position
定位属性分为两部分：定位模式和边偏移；
3.1定位模式：有四个属性
静态定位：static 一般是清空定位使用的；边偏移是不起作用的；
相对定位：relative 相对自己进行边偏移；但是以前的位置还继续占用，不脱坐标；
绝对定位：abssolute 完全脱标的，不占用空间的；
父级没有使用定位的话，子级使用的定位，坐标是以浏览器的左上角为基准点的；相反如果父亲有定位则以最近的父亲(一层一层往上找，直到找到有定位的父亲)的左上角作为基准点；
固定定位：fixed 认的是浏览器的，完全脱标，不占有位置，可以和边偏移一起使用；