浏览器盒子模型
一般来说有两种：IE版和标准W3C版
IE版和W3C版主要差别在于IE把border和padding都算进width中，而W3C版的则是width只包括content
默认浏览器会使用标准模型。如果需要使用替代模型，您可以通过为其设置box-sizing: border-box来实现。 这样就可以告诉浏览器使用border-box来定义区域，从而设定您想要的大小。
.box{
box-sizing:border-box;
}
如果你希望所有元素都使用替代模式，而且确实很常用，设置box-sizing在<html>元素上，然后设置所有元素继承该属性，正如下面的例子。如果想要深入理解，请看the CSS Tricks article on box-sizing。
html{
box-sizing:border-box;
}
*, *::before, *::after{
box-sizing:inherit;
}
网友评论