v8_浮动-CFANZ编程社区

v8_浮动

浮动作用

float: left right none

定义网页中其他文本如何环绕该元素显示
让竖着的内容横着来

清浮动，又称高度塌陷： clear: none允许 left/ right /both不允许左/右/有浮动

原本块浮动后下边的块会往界面上边移动，如此做会导致下边的块内容被漂浮块覆盖，
想不被覆盖，添加清浮动，clear设置需添加在被覆盖的块上
清除浮动只是改变元素的排列方式，该元素还是漂浮着，不占据文档位置

<style>
        .d1{
            width: 60px;
            height: 50px;
            background: red;
            float: left;               /*设置浮动*/
        }
        .d2{
            width: 120px;
            height: 80px;
            background: green;
            /* float: right; */
            clear: left;              /*被覆盖者设置clear清浮动*/
        }
    </style>
</head>
<body>
    <div class="d1"></div>
    <div class="d2"></div>
    <!-- <div style="clear: left;"></div> 
       当前盒子后面补一个盒子不设置长宽高也可以实现同样效果 -->

0 条评论