6浮动

作者: 行之北斗 | 来源:发表于2019-03-22 14:50 被阅读0次

塌陷是病,怎么治呢?
有两种治法。
第一种治法,除了上面的div,再做一个空的div,在该div的样式设置时,设置清除浮动

#clear{
                /* 用于清除浮动 */
                clear: both;
            }

        <div class="father">
            <div class="c1">
            </div>
            <div class="c2">
            </div>
            <div class="c3">
            </div>
            <div id="clear">
                
            </div>
        </div>

第二种治法,在father的css里,设置overflow:hidden 会触发重新计算div的高度

.father {
                width: 400px;
                /* height: 900px; */
                border: 1px solid red;
                /* 用来清除浮动 */
                overflow: hidden;
            }

相关文章

  • 6浮动

    塌陷是病,怎么治呢?有两种治法。第一种治法,除了上面的div,再做一个空的div,在该div的样式设置时,设置清除...

  • 浮动元素居中法

    1.现代浏览器浮动元素居中 2.兼容ie6的浮动元素居中法

  • 我们一起来学Photoshop之CS6的工作界面(5)

    六、浮动面板 Photoshop CS6拥有超过20种浮动的面板,其称之为浮动面板,他们可以独立于图像窗口和其他选...

  • Day6:html和css

    Day6:html和css 复习 清除浮动: overflow: hidden添加在需要清除浮动的地方 定位pos...

  • day23-markdown总结

    1.标准流和display属性 2.浮动 3.浮动(文字环绕) 4.清除浮动 5.定位 6.盒子模型 7.其他常用属性

  • Day21-CSS属性

    1、选择器的权重 2、浮动 3、文字环绕 4、清除浮动 5、display 6、定位 7、盒子模型 8、居中

  • CSS属性

    1、标准流和浮动 2、display属性 3、float属性 4、清楚浮动 5、文字环绕效果 6、定位 7、盒子模型

  • day4

    A.今天学了什么 1 轮廓属性 2 透明 3 css样式的继承 4 盒子浮动 5 清除浮动 6 定位:positi...

  • 2019-07-09 定位之float

    demo: 在上图中,几个div的设置如下: div5、div6、div9是浮动元素 我们可以看到,浮动元素后面的...

  • CSS浏览器兼容性

    IE6/IE5以下会出现的问题 1.双边距问题:当连续浮动,且浮动方向和设置外边距的方向一致时,第一个浮动元素距离...

网友评论

      本文标题:6浮动

      本文链接:https://www.haomeiwen.com/subject/wytrvqtx.html