开发者社区 问答 正文

box-sizing 属性默认的 对元素高宽的计算方式

在文档里box-sizing默认初始值是content-box;

div{
    width: 200px;
}
.div1{
    height: 250px;
    padding: 30px;
    background: blue;
}
.div2{
    height: 150px;
    background: yellow;
}

<div class="div1">
    <div class="div2">
    </div>
</div>

为什么这段在浏览器(firefox和edge)中未设置box-sizing属性它渲染的却是box-sizing:border-box;
screenshot

展开
收起
杨冬芳 2016-06-06 14:00:38 2295 分享 版权
1 条回答
写回答
取消 提交回答
  • IT从业

    因为你引用了bootstrap.css。

    bootstrap中除了特别指定的元素box-sizing:content-box以外,全局元素都设置box-sizing:border-box

    * {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
    }
    2019-07-17 19:28:28
    赞同 展开评论
问答分类:
问答地址: