清除浮动-父级添加overflow（HTML、CSS）

墨蓝 2023-10-03 13:24 33阅读 0赞

### 清除浮动-父级添加overflow（HTML、CSS） ###

<!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>清除浮动-父级添加overflow</title>
        <style>
            .box {
        
    
                overflow: hidden;
                /* 清除浮动 */
                width: 800px;
                border: 1px solid blue;
                margin: 0 auto;
            }
    
            .damao {
        
                float: left;
                width: 300px;
                height: 200px;
                background-color: purple;
            }
    
            .ermao {
        
                float: left;
                width: 200px;
                height: 200px;
                background-color: pink;
            }
    
            .footer {
        
                height: 200px;
                background-color: black;
            }
        </style>
    </head>
    
    <body>
        <div class="box">
            <div class="damao">大毛</div>
            <div class="ermao">二毛</div>
        </div>
    
    
        <div class="footer"></div>
    
    </body>
    
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，33人围观）

还没有评论，来说两句吧...

相关阅读

相关清除浮动

.clearfix display: inline-block &:after display: block c

叁歲伎倆/ 2024年02月19日 14:27/ 0 赞/ 45 阅读

相关清除浮动-父级添加overflow（HTML、CSS）

清除浮动-父级添加overflow（HTML、CSS） <!DOCTYPE html> <html lang="en"> <head>

墨蓝/ 2023年10月03日 13:24/ 0 赞/ 34 阅读

相关清除浮动

清除浮动主要是为了解决父级元素因为子级浮动而引起的内部高度为0的情况。清除浮动的方法有很多种，这里我只写被大家推荐切常用的方法。 1、父级添加伪类 // htm

柔光的暖阳◎/ 2023年08月17日 17:39/ 0 赞/ 140 阅读

相关清除浮动

.clear\{clear:both;height:0;overflow:hidden;\} 上诉办法是在需要清除浮动的地方加个div.clear或者br.clear，我们知

清疚/ 2022年06月09日 12:50/ 0 赞/ 302 阅读

相关浮动与清除浮动

使用方法：只需要在需要清楚浮动的div上添加类名 class="clearfix"即可例子： <div class="someclass clearfix">

小鱼儿/ 2022年05月16日 04:26/ 0 赞/ 316 阅读

相关浮动+清除浮动

界面布局 1.企业开发中什么时候使用标准流什么时候使用浮动流？垂直方向使用标准流，水平方向使用浮动流。 2.拿到一个很复杂的界面如何入手？从上至下布局、从

待我称王封你为后i/ 2021年10月30日 06:54/ 0 赞/ 558 阅读

相关父元素清除浮动

[清除浮动float (:after方法)][float _after] 1. 什么时候需要清除浮动？清除浮动有哪些方法？（1）对元素进行了浮动（float）后，该元

Myth丶恋晨/ 2021年10月09日 03:26/ 0 赞/ 463 阅读

相关清除浮动

通常清除浮动的方法： 1.添加一个空的div。clear：both 缺点：如果页面用了太多的浮动，结构就冗杂。 2.给父元素添加：overflow：auto；缺点：不

爱被打了一巴掌/ 2021年09月30日 03:52/ 0 赞/ 400 阅读

相关清除浮动

1.给父元素加溢出处理 overflow:hide 2.定义一个空元素，添加clear属性 3.结合伪元素after

た入场券/ 2021年09月14日 08:26/ 0 赞/ 403 阅读

相关清除浮动

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">

Myth丶恋晨/ 2021年09月14日 07:48/ 0 赞/ 410 阅读