这篇翻译不完整。请帮忙从英语翻译这篇文章。
Summary
margin-top
属性用来设置元素的顶部外边距,你也可以使用负值。
这个属性对于不可替换的inline元素没有效果,比如 <tt>
或者 <span>
.
初始值 | 0 |
---|---|
适用元素 | all elements, except elements with table display types other than table-caption , table and inline-table . It also applies to ::first-letter . |
是否是继承属性 | 否 |
Percentages | refer to the width of the containing block |
适用媒体 | visual |
计算值 | the percentage as specified or the absolute length |
是否适用于 CSS 动画 | yes, as a length |
正规顺序 | the unique non-ambiguous order defined by the formal grammar |
Syntax
/* <length> values */ margin-top: 10px; /* 绝对长度 */ margin-top: 1em; /*相对于字体大小 */ margin-top: 5%; /*相对于最相邻的父级元素块(block)的宽度*/ /* Keyword values */ margin-top: auto; /* Global values */ margin-top: inherit; margin-top: initial; margin-top: unset;
Values
<length>
- 设置固定长度 参考
<length>
来查看合适的值. <percentage>
- 百分比值
<percentage>
总是相对于 父元素块的宽度 auto
- 参考
margin
.
Formal syntax
<length> | <percentage> | auto
示例
.content { margin-top: 5%; } .sidebox { margin-top: 10px; } .logo { margin-top: -5px; } #footer { margin-top: 1em; }
说明
Specification | Status | Comment |
---|---|---|
CSS Basic Box Model margin-top |
Working Draft | 无改动 |
CSS Transitions margin-top |
Working Draft | 定义 margin-top 为可动画的属性. |
CSS Level 2 (Revision 1) margin-top |
Recommendation | 去除了在inline元素的效果。 |
CSS Level 1 margin-top |
Recommendation | 最初定义了该属性 |
浏览器兼容性
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
Basic support | 1.0 | 1.0 (1.7 or earlier) | 3.0 | 3.5 | 1.0 (85) |
auto value |
1.0 | 1.0 (1.7 or earlier) | 6.0 (strict mode) | 3.5 | 1.0 (85) |
Feature | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Basic support | 1.0 | 1.0 (1) | 6.0 | 6.0 | 1.0 |