理解css盒模型
css盒模型是css可视化格式化系统的基石，它是理解样式表如何工作的核心概念。盒模型可以用于元素定位和网页布局。
根据css盒模型的规定，每个元素（不管是块级还是内嵌元素）都会产生一个矩形盒子围绕在元素内容之外，这个盒子我们称为元素盒。
边框border
边框border是围绕着元素内容区和padding区画的一条线。边框有三个特征可以指定:宽度以及颜色。这些属性可以单个指定，也可以用缩写方式一次指定。关于边框的行为，有如下几条
* 边框画在元素背景之上。
* 非可替换内嵌元素（文本元素）的边框对于该元素所在行的行高没有影响。
* 可替换元素的边框将影响行高。
外边距margin
外边距margin是围绕在元素边框之外的可选区域。使用margin—top,margin-right，，margin-bottom，margin-left四个属性，可以分别设置盒模型的顶部，右部，底部，左部外边距。这四个外边距也可以用margin属性一次性缩写完成。
内边距padding
内边距padding是元素的内容区和边框之间的可选区域。如果我们给元素设置了边框，最好也设置padding，以防止边框紧紧挤压在内容周围。
原文：http://www.cnblogs.com/ljsbm325/p/5931619.html