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 子元素撑开父元素 清除浮动

  • android如何制作点击切换图片效果
  • web图表开发工具:FineReport 添加填报控件
  • MFC应用实例:[39]获得系统的时间日期
  • Visual Studio中常用标准控件解析
  • Android开发学习:[1]列表视图(ListView)
  • 热门搜索
    奇志大兵相声小品大全 刘太阳图片大全 qq昵称大全 微博怎么认证 网络公司名字大全 免费追剧大全在线观看 蜘蛛图片大全 罗贯中简介 柠檬福利导福航大全 lol怎么加好友