CSS margin

与 padding 的区别是什么？

CSS margin 和 padding 是两种常用的盒模型属性，它们都是用来控制元素边框与内容之间的距离。但它们之间有一些区别。 margin 是用于设置元素与其他元素之间的距离，而 padding 是用来设置元素边框与内容之间的距离。 margin 可以用于控制元素相对于其父元素和其他兄弟元素的位置和距离，而 padding 可以用于控制元素内容与其边框之间的距离。同时， margin 和 padding 的正值会导致元素周围的空白区域增加，负值则会导致元素挤压。

相关问题

css margin

CSS margin（外边距）属性用于控制元素周围的空白区域。它可以为元素定义上下左右四个方向的外边距。语法如下：

margin: 上边距 右边距 下边距 左边距;

也可以分别设置每个方向的外边距，如：

margin-top: 10px;
margin-right: 20px;
margin-bottom: 30px;
margin-left: 40px;

值可以使用绝对值（如px、em等）或百分比。当使用百分比时，它是相对于包含块的宽度计算的。如果只设置一个值，则它将应用于所有四个方向。如果设置两个值，则第一个值应用于上下边距，第二个值应用于左右边距。如果设置三个值，则第一个值应用于上边距，第二个值应用于左右边距，第三个值应用于下边距。

css margin 参数

CSS margin 属性用于设置元素的外边距。

语法：

margin: length|initial|inherit;

参数：

- length：可以是一个长度值，如 px、em、rem 等，也可以是百分比值。
- initial：将该属性设置为它的默认值。
- inherit：继承父元素的 margin 值。

margin 属性有四个方向的值：上、右、下、左，分别用上述参数设置。

例如：

margin-top: 10px; /* 上边距为 10 像素 */
margin-right: 20px; /* 右边距为 20 像素 */
margin-bottom: 30px; /* 下边距为 30 像素 */
margin-left: 40px; /* 左边距为 40 像素 */

也可以使用简写属性，将四个方向的值用空格分隔开来，分别对应上、右、下、左：

margin: 10px 20px 30px 40px; /* 上、右、下、左的值依次为 10px、20px、30px、40px */

如果只设置了两个值，分别对应上下和左右：

margin: 10px 20px; /* 上下的值为 10px，左右的值为 20px */

如果只设置了一个值，则表示四个方向都是这个值：

margin: 10px; /* 四个方向的值都为 10px */