主要是想问一下,当元素没有宽高的时候,box-sizing的问题:
1:div1为默认的content-box
<style>
*{
margin: 0;
padding: 0;
}
.div0{
width: 300px;
height: 300px;
background-color: crimson;
}
.div1{
background-color: greenyellow;
padding-left: 50px;
}
</style>
<body>
<div class="div0">
<div class="div1">1233333333333</div>
</div>
</body>
2:div1为border-box
<style>
*{
margin: 0;
padding: 0;
}
.div0{
width: 300px;
height: 300px;
background-color: crimson;
}
.div1{
background-color: greenyellow;
box-sizing: border-box;
padding-left: 50px;
}
</style>
<body>
<div class="div0">
<div class="div1">1233333333333</div>
</div>
</body>
我发现在给了padding的情况下,他们的content部分,宽度都是一样的。
可设置了border-box的话,content部分不是应该小一点吗?
或者说设置了content-box的话,content部分应该大一点呀。
不是很懂,求大神指点下!
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…