CSS浮动与定位

浮动Float

1、子级浮动，父级塌陷

eg：li浮动，在ul边框下显示，且ul height为0

2、包裹性

若浮动元素没有设置宽度，会折叠到最小宽度

3、元素浮动后，横向的margin会叠加

4、浮动元素影响其他元素位置布局等

5、overflow：hidden，隐藏超出部分。在子级浮动时，可以找回父级的高度。

定位

1、position的默认值是static

2、相对定位：relative

相对自己本来的位置进行移动，原来位置是保留的。

3、绝对定位：absolute

以最近一个非静态的父级元素作为0.0点计算移动位置，会脱离文档流。

4、固定定位：fixed

会脱离常规文档流元素

5、float与absolute、fixed不能同时应用与同一个

6、z-index与relative一起使用，可以使被覆盖的图片显示出来。