CSS盒模型

       盒子模型（如下图）：

        外边距:	改变元素外边的间距
		内边距: 	改变元素与内容的间距
		
		padding用法：
			padding:一个值; 一个值,改变四个方向
			padding:上下  左右;
			padding:上 左右 下;
			padding:上 右 下 左;顺时针方向变化
			
			padding-top:顶部内边距;
			padding-right:右内边距;
			padding-bottom:底部内边距;
			padding-left:左内边距;
			注意:内边距没有负值;
			
		margin用法：
			margin:四个方向;
			margin:上下 左右;
			margin:上 左右 下;
			margin:上 右 下 左;
			
			margin-top:上外边距;
			marign-right:右外边距;
			marign-bottom:下外边距;
			marign-left:左外边距;
			注意: margin可以为负值, auto自适应
			
		margin常见bug:
			1: 上下外边距相遇,只显示较大值
			2: 嵌套关系的元素,子元素的上外边距和父元素的上外边距相遇,取较大值
			
		盒模型占位计算:
			w= width+左右边框+左右内边距+左右外边距
			h= height+上下边框+上下内边距+上下外边距

注： padding和border会将已经设置好宽高的元素撑开；
     如果添加了padding或border之后；还想是以前的宽高，就需要做减法