内边距和外边距

padding–内边距

内边距，在边框和内容区之间的空白区域。
padding 属性接受长度值或百分比值（或者auto），不允许为负值

1.四个方向内边距一致时：
padding:10px;   //元素距离外部父元素给边框的距离均为10px
2.四个方向还可按着上、右、下、左的顺序分别定义各内边距：
padding:10px 5px 10px 5px;  //各内边距单位不统一也可以
3.分别定义上下、左右内边距：
padding:10px 5px;   //前边的值定义上下内边距，后边的值定义左右内边距

除了同时定义四个方向的内边距外，还可单独定义某一方向的内边距：

• padding-top
• padding-right
• padding-bottom
• padding-left
  代码展示：

padding-top:0px;
padding-right:5px;
padding-bottom:10em;
padding-left:5%;

注意：

内边距，不管是上下还是左右，如果要使用百分比定义的话，都是根据父元素的width属性计算的，这点儿很容易掉入误区：上下根据height,左右根据width

margin–外边距

围绕在元素边框的空白区域是外边距。设置外边距会在元素外创建额外的“空白”。

外边距的设置规则同内边距。

另外，我们还可以利用margin属性，做水平居中控制：

margin:0 auto;