border的属性：
width：粗细程度，一般都以px为单位，color：颜色，与文字的color属性一样，style：样式，solid（实线）、dashed（虚线）、dotted（点划线）、none（不显示）.....等等较为常用。border常用样式可以写在一起，例如：border：1px solid blue.
padding表示“内容”与“边框”之间的间隙
形式：padding：padding-top | padding-right | padding-bottom | padding-left 也就是上、右、下、左
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><style type="text/css">#div1{width:300px;height:200px;border:1px solid #CDCDCD;padding:100px 60px 50px 20px;color:#A52A2A}</style></head><body><div id="div1">标准盒子模型测试</div></body>
</html>margin（外边距）的使用：
理解margin作用：用于控制块与块之间的距离。块元素之间的左右margin。
结论：当两个块元素紧邻的时候，它们之间的距离为第一个元素的margin-right加上第二个元素的margin-left。
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>margin详解</title><style type="text/css">div{width:100px;height:50px;border:1px solid blue;background-color: #E66B14;}#div1{margin-right:20px;float:left;}#div2{margin-left:50px;float:left;}</style></head><body><div id="div1">div1</div><div id="div2">div2</div></body>
</html>块元素之间的上下margin：在块级元素中当两个div设置了margin-top和margin-bottom时，两个块级元素的实际间隔并不是二者相加，而是二者取其“较大”者。
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><style type="text/css">#div1{width:300px;height:200px;border:20px solid gray;}#div2{width:200px;height:100px;border:1px solid blue;background-color:yellow;margin-top:0px;margin-left:0px;}</style></head><body><div id="div1"><div id="div2">字块元素</div></div></body>
</html>