CSS清除浮动常用方法小结 CSS clear both {overflow:auto;zoom:1;}

时间：2023-12-21 18:41:47

常用的清除浮动的方法有以下三种:

此为未清除浮动源代码，运行代码无法查看到父级元素浅黄色背景

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title></title>
    <style type="text/css">
        * {
            margin: 0;
            padding: 0;
        }
        body {
            font: 36px bold;
            color: #F00;
            text-align: center;
        }
        #layout {
            background: #FF9;
        }
        #left {
            float: left;
            width: 20%;
            height: 200px;
            background: #DDD;
            line-height: 200px;
        }
        #right {
            float: right;
            width: 30%;
            height: 80px;
            background: #DDD;
            line-height: 80px;
        }

    </style>
</head>

<div id="layout">
    <div id="left">Left</div>
    <div id="right">Right</div>
</div>
</html>
result:
aaarticlea/png;base64,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" alt="" />

三种清除浮动方法如下：



1、使用空标签清除浮动。我用了很久的一种方法，空标签可以是div标签，也可以是P标签。我习惯用<P>，够简短，也有很多人用<hr>，只是需要另外 为其清除边框，但理论上可以是任何标签。这种方式是在需要清除浮动的父级元素内部的所有浮动元素后添加这样一个标签清除浮动，并为其定义CSS代 码：clear:both。此方法的弊端在于增加了无意义的结构元素。




对于使用额外标签清除浮动（闭合浮动元素），是W3C推荐的 做法。至于使用<br />元素还是空<div></div>可以根据自己的喜好来选（当然你也可以使用其它块级元素）。不过要注意的 是，<br />本身是有表现的，它会多出一个换行出来，所以要设定它的heigh为0，以隐藏它的表现。所以大多数情况下使用空<div>比较合 适。


<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title></title>
    <style type="text/css">
* {
margin: 0;
padding: 0;
        }

        body {
font: 36px bold;
color: #F00;
text-align: center;
        }

        #layout {
background: #FF9;
        }

        #left {
float: left;
width: 20%;
height: 200px;
background: #DDD;
line-height: 200px;
        }

        #right {
float: right;
width: 30%;
height: 80px;
background: #DDD;
line-height: 80px;
        }

        .clr {
clear: both;
        }

    </style>
</head>

<div id="layout">
    <div id="left">Left</div>
    <div id="right">Right</div>
    <p class="clr"></p>

</div>
</html>

result:
aaarticlea/png;base64,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" alt="" />


2、使用overflow属性。此方法有效地解决了通过空标签元素清除浮动而不得不增加无意代码的弊端。使用该方法是只需在需要清除浮动的元素中定义CSS属性：overflow:auto，即可！”zoom:1″用于兼容IE6,也可以用width:100%。




不过使用overflow的时候，可能会对页面表现带来影响，而且这种影响是不确定的，你最好是能在多个浏览器上测试你的页面；


<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title></title>
    <style type="text/css">
        * {
            margin: 0;
            padding: 0;
        }

        body {
            font: 36px bold;
            color: #F00;
            text-align: center;
        }

        #layout {
            background: #FF9;
            overflow: auto;
            zoom: 1; /* overflow:auto可以换成overflow:hidden，zoom:1可以换成width:100%*/
        }

        #left {
            float: left;
            width: 20%;
            height: 200px;
            background: #DDD;
            line-height: 200px;
        }

        #right {
            float: right;
            width: 30%;
            height: 80px;
            background: #DDD;
            line-height: 80px;
        }

    </style>
</head>

<div id="layout">
    <div id="left">Left</div>
    <div id="right">Right</div>

</div>
</html>
result:


aaarticlea/png;base64,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" alt="" />


3、使用after伪对象清除浮动。
 该方法只适用于非IE浏览器 。具体写法可参照以下示例。
使用中需注意以下几点。
　　一、该方法中必须为需要清除浮动元素的伪对象中设置height:0，否则该元素会比实际高出若干像素；
　　二、content属性是必须的，但其值可以为空，蓝色理想讨论该方法的时候content属性的值设为”.”，但我发现为空亦是可以的。




<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title></title>
    <style type="text/css">
        * {
            margin: 0;
            padding: 0;
        }

        body {
            font: 36px bold;
            color: #F00;
            text-align: center;
        }

        #layout {
            background: #FF9;

        }

        #layout:after {
            display: block;
            clear: both;
            content: "";
            visibility: hidden;
            height: 0;
        }

        #left {
            float: left;
            width: 20%;
            height: 200px;
            background: #DDD;
            line-height: 200px;
        }

        #right {
            float: right;
            width: 30%;
            height: 80px;
            background: #DDD;
            line-height: 80px;
        }

    </style>
</head>

<div id="layout">
    <div id="left">Left</div>
    <div id="right">Right</div>

</div>
</html>




aaarticlea/png;base64,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" alt="" />

此三种方法各有利弊，使用时应择优选择，个人习惯于第一种，比较稳定可靠。





相关文章