css中的盒模型

1、标准盒模型

盒子大小=内边距+元素+边框

border-xxx：四个值；则分别表示上、右、下、左，border-xxx：三个值；则分别表示上、左右、下，border-xxx：两个值；则表示上下、左右，border-xxx：一个值；则上下左右都是如此。此同样适用于padding和margin

Border-radius:可以创建四个角的圆角，用px或em来指定角的半径大小，也可以只指定一个角，eg:border-top-left-radius:15px; 

当两个盒子上下放置时，在上面盒子的margin-bottom和下面盒子的margin-top之间取最大值作为他们之间的距离，当两个盒子左右放置时，他们之间的距离为左边盒子的margin-right和右边盒子的margin-left的和。

若父子元素的垂直外边距相邻了，则子元素的外边距会设置给父元素，例如：大盒子中有个小盒子，给小盒子设置上外边距则大盒子和小盒子会整体下移，解决这种问题的方法是给盒子增加上边距或边框，但要注意改变盒子整体的大小。

2、IE盒模型

IE盒子模型与标准模型的唯一区别在于IE盒模型内容区包括了padding和border