浮动高度丢失及其解决方法有哪些?

浮动元素：

按照流水排列：寻找能最小放下的位置，浮动会半脱离文档流，遮住其他未浮动元素的结构,但不会遮住内容

元素都设置浮动，会造成父元素高度丢失

解决办法：

1：让父级浮动起来，但是会让父级脱离文档流

2: 给父级添加 onerflow:hidden 但是不友好

3：給父元素设置display:inline-block 类似文本效果

BFC方案：

1：在浮动元素后添加空白块，clear:both

2:给父元素添加伪类：设置clear:both

3:给父元素添加position，relative或者absolute可以解决高度丢失，父类后面写东西会被前面的定位遮住，可以用z-index设值显现出来，写的东西设置margin值很容易产生边距塌陷。

定位：

定位的元素能脱离文档流，不再是页面元素，会遮住其他结构和内容