margin是css中的一个常用属性,margin有多种省略写法,刚接触的时候不太容易搞懂,因此本文特别记录一下。
css手册中对margin属性的说明为:
检索或设置对象四边的外补丁。默认值为 0 0。
如果提供全部四个参数值,将按上-右-下-左的顺序作用于四边。如果只提供一个,将用于全部的四边。如果提供两个, 第一个用于上-下,第二个用于左-右。如果提供三个,第一个用于上,第二个用于左-右,第三个用于下。
margin省略数值的写法,基本原则如下:
1.如果没有left值,则使用right代替;
2.如果没有bottom值,则使用top代替;
3.如果没有right值,则使用top值代替。
1).如果margin只有三个值,按照值的顺序为margin:top right bottom;缺少了left,根据原则,则left的值有right来代替。
margin:10px 20px 30px;就等于margin:10px 20px 30px 20px;
2).如果margin只有两个值,按照值的顺序为margin:top right;缺少了bottom和left,根据原则left的值由right来代替,bottm的值由top来代替。
margin:10px 20px;就等于margin:10px 20px 10px 20px;
3).如果margin只有一个值,按照值的顺序为margin:top;缺少了bottom、left和right,根据原则left的值由right来代替,bottom的值由top来代替,right的值右top来代替,也就是说left的值也由top来代替。
margin:10px; 就等于margin:10px 10px 10px 10px;
更多精彩内容:http://www.bianceng.cnhttp://www.bianceng.cn/web/Css/