CSS3:盒子模型box-sizing

box-sizing:content-box(默认)/border-box/inherit

content-box:标准盒模型,CSS定义的宽高只包含content的宽高
CSS3:盒子模型box-sizing_第1张图片
border-box:IE盒模型,CSS定义的宽高包括了content,padding和border
CSS3:盒子模型box-sizing_第2张图片
inherit:继承其父元素的盒模型

说一个cvte的一个面试题:写一个四栏布局,然后每两个中间间隔为20px;
当时很紧张,想到了用flex,但是结果都不太理想,然后面试官给我写了一个方法,当时真的是很佩服,感觉虽然不难,但是人家考虑的很周到。大概代码是这个样子的

DIV1
DIV2
DIV3
DIV4
DIV5

你可能感兴趣的:(CSS3:盒子模型box-sizing)