CSS参考手册
基本框模型 | Basic Box Model
顶部边距 | margin-top
margin-top
属性用来设置元素的顶部外边距,你也可以使用负值。
/* <length> values */
margin-top: 10px; /* An absolute length */
margin-top: 1em; /* relative to the text size */
margin-top: 5%; /* relative to the nearest block container's width */
/* Keyword values */
margin-top: auto;
/* Global values */
margin-top: inherit;
margin-top: initial;
margin-top: unset;
初始值 |
0 |
---|---|
适用元素 |
all elements, except elements with table display types other than table-caption, table and inline-table. It also applies to ::first-letter. |
是否是继承属性 |
no |
Percentages |
refer to the width of the containing block |
适用媒体 |
visual |
计算值 |
the percentage as specified or the absolute length |
Animation type |
a length |
正规顺序 |
the unique non-ambiguous order defined by the formal grammar |
语法
该margin-top
属性被指定为关键字auto
,或<length>
或<percentage>
。它的值可以是正值,零值或负值。
值
<length>
设置固定长度 参考<length>
来查看合适的值.<percentage>
百分比值<percentage>
总是相对于 父元素块的宽度auto
参考margin
.
正式语法
<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 ModelThe definition of 'margin-top' in that specification. |
Working Draft |
No significant change |
CSS TransitionsThe definition of 'margin-top' in that specification. |
Working Draft |
Defines margin-top as animatable. |
CSS Level 2 (Revision 1)The definition of 'margin-top' in that specification. |
Recommendation |
Removes its effect on inline elements. |
CSS Level 1The definition of 'margin-top' in that specification. |
Recommendation |
Initial definition |
浏览器兼容性
Feature |
Chrome |
Edge |
Firefox (Gecko) |
Internet Explorer |
Opera |
Safari (WebKit) |
---|---|---|---|---|---|---|
Basic support |
1.0 |
(Yes) |
1.0 (1.7 or earlier) |
3.0 |
3.5 |
1.0 (85) |
auto value |
1.0 |
(Yes) |
1.0 (1.7 or earlier) |
6.0 (strict mode) |
3.5 |
1.0 (85) |
Feature |
Android |
Edge |
Firefox Mobile (Gecko) |
IE Phone |
Opera Mobile |
Safari Mobile |
---|---|---|---|---|---|---|
Basic support |
1.0 |
(Yes) |
1.0 (1) |
6.0 |
6.0 |
1.0 |
基本框模型 | Basic Box Model相关
层叠样式表( Cascading Style Sheets )是一种用来表现 HTML 或 XML 等文件样式的计算机语言。CSS 不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。