保证金是多少:5px 0; 和保证金:5px 0 0; 意思？

Question

是否margin:5px 0;意味着margin:5px 0 0 0;还是margin:5px 0 5px 0;？

是否margin:5px 0 0;意味margin:5px 0 0 0;？

填充当然也是一样的.

此外,它是否在所有浏览器(包括IE6)中保持一致？

Answer 1

根据Box模型:

• 如果只有一个值,则适用于所有方面.
• 如果有两个值,则顶部和底部边距设置为第一个值,右边 距和左边距设置为第二个.
• 如果有三个值,则将top设置为第一个值,将left和right 设置为第二个值,将bottom 设置为第三个值.
• 如果有四个值,则它们分别应用于顶部,右侧, 底部和左侧.

body { margin: 2em }         /* all margins set to 2em */
body { margin: 1em 2em }     /* top & bottom = 1em, right & left = 2em */
body { margin: 1em 2em 3em } /* top=1em, right=2em, bottom=3em, left=2em */

这是由CSS标准定义的,因此它应该在所有正确实现CSS的浏览器中保持一致.对于浏览器兼容性,请查看blooberry的CSS支持历史记录和quirksmode.根据blooberry,margin首先在IE3中实现,所以IE6应该没问题.

Answer 2

对于边距和填充,您可以指定一个,两个,三个或四个以空格分隔的值:

1. 一个值:所有四个方面都使用该值.
2. 两个值:top/bottom获取第一个值; 左/右获得第二个
3. 三个值:top获得第一个,left/right获得第二个,bottom获得第三个
4. 四个值:顶部,右侧,底部,左侧(即从中午顺时针)获取每个值