CSS外头距属性(margin)的使用方法
日期：2014-05-17 浏览次数：20698 次
CSS外边距属性(margin)的使用方法
??? 外边距是页面中设置元素与另一个元素之间距离的属性，如果想完全使用CSS布局代替传统table布局，那就需要好好掌握外边距的特性。
?
??? Html中有些标签带有默认的margin属性，比如<p>和<body>，在重新设置它们的值后就会覆盖默认样式。
??? 按照设置方位不同，margin有四个属性：
上边距（margin-top）
??? 定义元素上方外边距的宽度，有三个属性值：
·??????????????? ????长度，用绝对长度和相对长度定义一个值。
·??????????????? ????百分数，基于父层元素的宽度的百分数。
·??????????????? ????auto，浏览器自动设置，多为居中显示。
示例：
? #sbj {margin-top:5px;}
右边距（margin-right）
??? 和上边距相同，它定义元素右方外边距的宽度，设置方法和上边距margin-top相同。
下边距（margin-bottom）
??? 和以上两属性相同，设置元素下方外边距宽度。
左边距（margin-left）
??? 和以上三属性相同，设置元素左方外边距宽度。
外边距（margin）
margin是外边距的综合写法，它可以同时定义上下左右四个方向的外边距宽度，定义顺序是顺时针的上-右-下-左。
?
? margin：top right bottom left；
?
??? 和前面padding、border中介绍的一样，margin属性值的定义数量和它的方向是对应的。如果设置了四个值，则按照上右下左的顺序显示出效果；如果只设置一个值，将作用于四个边；如果定义两个值，第一个作用于上下，第二个值作用于左右；如果定义三个值，第一个作用于上方，第二个值作用于左右，第三个值作用于下放。
?
示例
