Margin - 简写属性

为了缩减代码,可以在一个属性中指定所有外边距属性。

margin 属性是以下各外边距属性的简写属性:

margin-top

margin-right

margin-bottom

margin-left

工作原理是这样的:

如果 margin 属性有四个值:

margin: 25px 50px 75px 100px;

上外边距是 25px

右外边距是 50px

下外边距是 75px

左外边距是 100px

实例

margin 简写属性设置四个值:

p {

margin: 25px 50px 75px 100px;

}

亲自试一试

如果 margin 属性设置三个值:

margin: 25px 50px 75px;

上外边距是 25px

右和左外边距是 50px

下外边距是 75px

实例

使用已设置三个值的 margin 简写属性:

p {

margin: 25px 50px 75px;

}

亲自试一试

如果 margin 属性设置两个值:

margin: 25px 50px;

上和下外边距是 25px

右和左外边距是 50px

实例

使用设置了两个值的 margin 简写属性:

p {

margin: 25px 50px;

}

亲自试一试

如果 margin 属性设置了一个值:

margin: 25px;

所有四个外边距都是 25px

实例

使用设置一个值的 margin 简写属性:

p {

margin: 25px;

}

亲自试一试