css 子元素撑开父元素 清除浮动

时间:2026-02-17 19:24:22

1、首先  .right 与 .left 为 .box 的子元素,且浮动。

.box{   // 父元素切记height: auto;

   height: auto;

   border-bottom:20px solid grey;

}

.left{

    height: 9rem;

    width: 9rem;

    top: 2.5rem;

    left: 2.5rem;

    float: left;

    margin: 2.5rem 1.25rem 1.25rem 2.5rem;

}

.right{

    float: left;

    top:2.5rem;

    left: 12.75rem; 

    width: 46rem;

    margin: 2.5rem 1.25rem 0rem 0rem;

}

css 子元素撑开父元素 清除浮动

2、用 :after清除浮动

只需在 父元素 .box,清除浮动就可以。

若  .right 与 .left 的子元素有浮动。仍旧给其添加以下css属性。

.box:after{

    display:block;

    content: '';

    clear:both;

    height: 0px;

}

css 子元素撑开父元素 清除浮动

© 2026 一点资料
信息来自网络 所有数据仅供参考
有疑问请联系站长 site.kefu@gmail.com