其他分享
首页 > 其他分享> > box-sizing

box-sizing

作者:互联网

<style>
	.box{
		width:150px;
		height:150px
	}
</style>
<body>
	<img src="img/1.jpg" class="box">
</body>

box-sizing有两个属性值:content-box和border-box。

根据上例,如果给box的box-sizing设置content-box,则图片内容宽高为150*150 px(如果为图片加padding和border是向外扩张);

如果给box的box-sizing设置border-box,则指定的宽高150*150 px是从图片外面的边框算起(如果为图片加padding和border是向内压缩)。

因此,为了避免在给block设置外部样式时破坏原有布局,一般情况下建议使用border-box。

标签:box,sizing,150,150px,border,图片
来源: https://blog.csdn.net/weixin_54362381/article/details/114964516