一、盒子模型
1.width、height
宽高可以用px或者%实现。%表示父亲元素的百分之多少。
2.border
2.1）border-width：边框粗细
数字+px。border-width:上 右 下 左；
2.2）border-style：边框样式
实线：solid、虚线：dashed、点线：dotted。border-style:上 右 下 左；
2.3）border-color：边框颜色
border-color:上 右 下 左；
2.4）单边框不连写
border-方向-width/style/color
2.5）连写(无顺序要求)
border/border-方向：width style color
比如：border: 1px solid #eeeee
二、CSS3盒子模型（自动内减）：box-sizing--border-box
3.1）box-sizing：content-box（不写这句话，默认这个盒子就是content-box）
box_base.jpg
3.2）box-sizing：border-box，此时这个盒子的宽度包含border、padding和内容。即border、padding不会撑开盒子了。这也就是IE模型
box_model.jpg
三、总结
margin不算在盒子本身大小上。开发中，如果因为添加了边框而导致一行的位置不够放，可以手动缩小内容宽高。
如果想保持一个盒子的真实占有宽度不变，那么加width的时候就要减padding。加padding的时候就要减width。因为盒子变胖了是灾难性的，这会把别的盒子挤下去。
