clear不起作用的情况

最新推荐文章于 2024-05-29 10:40:22 发布

转载最新推荐文章于 2024-05-29 10:40:22 发布 · 629 阅读

·

0

·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/aby57/p/3602502.html

<style type="text/css">
    .first
    {
        width:100px;
        height:100px;
        border:1px solid red;
        float:left;
    }
    .second
    {
        width:100px;
        height:100px;
        border:1px solid blue;
        float:left;
        clear:right;
    }
    .third
    {
        width:100px;
        height:100px;
        border:1px solid green;
        float:left;
    }
</style>
</head>
<body>
    <div class="first"></div>
    <div class="second"></div>
    <div class="third"></div>
</body>
</html>

这里的第三个div并不会因为第二个div 的clear:right而另起一行。因为第二个div要清楚右浮动时，第三个div还没开始加载，所以，clear对它不起作用。

另外一个可能clear不起作用的原因：

当上面的第一个和第二个div使用绝对定位的情况下，即使第三个div设置了clear：both，他也不会另起一行，因为绝对定位已经独立于文档之外，不占用文档的空间，因而不会对其他元素产生影响。

转载于:https://www.cnblogs.com/aby57/p/3602502.html

评论

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。