box-sizing 是用来规定一个元素及其 border 和 padding 的关系的属性。
以下均以宽高均为 200px ,padding 及 border-width 均为 20px 的元素来举例说明两种情况下的布局情况。
div {
height: 200px;
width: 200px;
padding: 20px;
border-width: 20px;
}
Val. content-box (默认)
此情况下,元素的 border 及 padding 参与元素的尺寸计算。
元素实际占用空间 =