clear:both;清除浮动float

我们知道有时使用了css float浮动会产生css浮动，这个时候就需要清理清除浮动，我们就用clear样式属性即可实现。

为什么要清除浮动：

1.之前写的时候都会发现页面写着写着就发生错乱，而且还有重叠？就是浮动惹的祸！

2.父级元素下面的子元素float时，可能会导致父级height值为0；故在使用了float之后，立即在父级上面加上clearfix，彻底消除float带来的各种怪异问题！

在用H5进行布局的时候发生了灵异事件，明明布局正确，但是布局乱起来，查找了一段时间，还是不能将排版改正过来。我也只知道是浮动那边出的问题。要解决情况，就需要使用clear:both了。

CSS手册指示：该属性的值指出了不允许有浮动对象的边。这个属性是用来控制float属性在文档流的物理位置的。

当属性设置float（浮动）时，其所在的物理位置已经脱离文档流了，但是大多时候我们希望文档流能识别float（浮动），或者是希望float（浮动）后面的元素不被float（浮动）所影响，这个时候我们就需要用clear:both;来清除。

1、clear语法：

clear : none | left|right| both 

2、clear参数值说明：

none : 　允许两边都可以有浮动对象

both : 　不允许有浮动对象

left : 　不允许左边有浮动对象

right : 　不允许右边有浮动对象

3、clear解释：

该属性的值指出了不允许有浮动对象的边情况，又对象左边不允许有浮动、右边不允许有浮动、不允许有浮动对象。

4、css结构

div{clear:left}

div{clear:right}

div{clear:both}

本站声明:网站内容来源于网络,如有侵权,请联系我们https://www.qiquanji.com,我们将及时处理。

微信扫码关注

更新实时通知