本文详细介绍了浮动(float)的概念，如何通过left、right和none设置元素浮动，以及浮动在布局中的作用，特别是早期用于图片布局。接着，讨论了浮动带来的问题，如父元素高度塌陷，并解释了清除浮动(clear)的重要性，提供了clear:left、right和both的使用方法。通过实例展示了如何使用浮动实现元素并排显示，以及如何通过额外标签法清除浮动影响，确保布局的稳定性。
浮动：
元素的浮动是指设置了浮动属性的元素会脱离标准普通流的控制，移动到其父元素中指定位置的过程。
对于早期来说，浮动是用来控制图片的，后来慢慢偏离了便利用浮动的特性来进行布局。
设置浮动的通常来通过float属性来控制浮动，
语法如下：
- float：left；元素向左浮动
- float：right；元素向右浮动
- float：none；元素不浮动
清除浮动
清除浮动的作用是用来，清除对于布局带来的影响。
由于浮动元素不再占用原文档流的位置，所以它会对后面的元素排版产生影响，为了解决这些问题，此时就需要在该元素中清除浮动。
清除浮动语法：
Clear:left;不允许左侧有浮动元素（清除左侧浮动的影响）
Clear:right;不允许左侧有浮动元素（清除左侧浮动的影响）
Clear:both; 同时清除左右两侧浮动的影响
通过实例我们可以了解浮动和清除浮动的运用
下面是我们没有设置浮动的效果，
下面我们想要让拿两个小div盒子并排显示，则就需要设置浮动，给他们设置一个左浮动即可
实现的效果、
我们可以看到由于父元素的盒子由于浮动的元素脱离了文档流，所以我们要设置清除浮动。
我们可以通过额外标签法来清除浮动
通过在浮动元素末尾添加一个空的标签
清除浮动后的效果如下
扫一扫
2867
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
