css 外边距

/* 示例代码：设置外边距 */

/* 使用 margin 属性为所有四个方向设置相同的外边距 */
.example1 {
    margin: 20px;
}

/* 使用 margin 属性分别为上、右、下、左设置不同的外边距 */
.example2 {
    margin: 10px 20px 30px 40px; /* 上 右 下 左 */
}

/* 使用 margin 属性分别为垂直和水平方向设置不同的外边距 */
.example3 {
    margin: 15px 30px; /* 上下 左右 */
}

/* 使用 margin 属性为单个方向设置外边距 */
.example4 {
    margin-top: 10px;
    margin-right: 20px;
    margin-bottom: 30px;
    margin-left: 40px;
}

/* 设置自动外边距，通常用于居中对齐 */
.example5 {
    margin: auto;
}

解释说明：

• margin 属性用于设置元素的外边距（即元素与其他元素之间的空白区域）。
• margin 可以接受一个或多个值，分别控制不同方向的外边距：
  • 单个值：所有四个方向的外边距相同。
  • 四个值：按顺序分别设置上、右、下、左的外边距。
  • 两个值：第一个值设置上下外边距，第二个值设置左右外边距。
  • 单独设置某个方向的外边距可以使用 margin-top、margin-right、margin-bottom 和 margin-left。
• auto 值可以使元素在父容器中水平居中对齐。