[SkylerAI]零碎知识点10-CSS3 box-sizing属性

一 盒子模型

四个边界:margin(外边距),border(边框),padding(内边距),content(内容区域)


盒子模型.png

二 box-sizing属性

1.属性值为border-box

width = content-width + padding-left-width + paddling-right-width + border-left-width + border-right-width
height = content-height + padding-top-height + paddling-bottom-width + border-top-width + border-bottom-width

2.属性值为content-box(默认值)

width = content-width
height = content-height

3.属性值为inherit

从父元素继承 box-sizing 属性的值

你可能感兴趣的:([SkylerAI]零碎知识点10-CSS3 box-sizing属性)