css margin顺序

作者：颠沛流离的伤发布日期:2026-03-04 浏览:135

/* CSS margin顺序示例 */

/* margin 的四个值分别表示上、右、下、左的外边距 */
.box {
    margin: 10px 20px 30px 40px;
}

/* margin 的两个值分别表示上下和左右的外边距 */
.box {
    margin: 10px 20px;
}

/* margin 的一个值表示四边的外边距都相同 */
.box {
    margin: 10px;
}

/* margin 的三个值分别表示上、左右、下的外边距 */
.box {
    margin: 10px 20px 30px;
}

解释说明：

margin 属性用于设置元素的外边距。它可以通过不同的方式指定四个方向的外边距：
- 四个值：按顺时针顺序分别为上、右、下、左。
- 两个值：第一个值为上下外边距，第二个值为左右外边距。
- 一个值：所有四个方向的外边距都相同。
- 三个值：第一个值为上外边距，第二个值为左右外边距，第三个值为下外边距。

希望这个示例能帮助你理解 margin 的不同写法及其顺序。

上一篇：css 偶数行变色

下一篇：css横向滚动条