css3之box-sizing属性和background-clip

1. content-box 是默认值。如果你设置一个元素的宽为100px，那么这个元素的内容区会有100px 宽，并且任何边框和内边距的宽度都会被增加到最后绘制出来的元素宽度中。加上padding和boreder之后整个盒子的宽度会大于100px。
2. border-box 告诉浏览器：你想要设置的边框和内边距的值是包含在width内的。也就是说，如果你将一个元素的width设为100px，那么这100px会包含它的border和padding，内容区的实际宽度是width减去(border padding)的值。大多数情况下，这使得我们更容易地设定一个元素的宽高。

background-clip 置元素的背景（背景图片或颜色）是否延伸到边框、内边距盒子、内容盒子下面。
默认情况下，背景覆盖边框盒。

详情显示可以看MDN

background-clip