css盒子模型，英文:Box Model，是用来设计和布局时使用,所有的HTML标记都可以是一个盒子。css盒子模型是网页设计中经常用到的CSS技术所使用的一种思维模型，CSS盒模型本质上是一个盒子，封装周围的HTML元素，它的属性包括：内容(content)、内边距(padding)、边框(border)、外边距(margin)。
内容（content），就是盒子里装的东西，显示文本和图像。
边框(border)，就是盒子本身，围绕在内边距和内容外的边框。
内边距(padding)，围绕在内边距和内容外的边框。
外边距(margin)，外边距是透明的。
上面介绍有说到所有的HTML标记都可以是一个盒子，所以避免出现HTML标记占用宽高而造成页面布局错乱，在写css样式的时候我们需要设定统一的样式来消除。
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td, button{padding:0;margin:0;}
另外，在使用边框，内边距和外边距的时候，盒子的整体宽高是要加上你所设定的边框、内边距和外边距。
下面是HTML代码：
运行后的效果：
