CSS | margin-inline-start 属性

介绍

margin-inline-start 属性被用于设置元素内联轴（例如，文字的行内方向）的起始端margin的大小。

这个属性与 CSS margin 属性结构中的 margin-left（或 margin-right）相似，但是 margin-inline-start 会受到文本方向（或元素的方向）的影响。默认地，在从左向右书写的方向下，margin-inline-start 会应用到元素的左边距上；在从右向左书写的方向下，margin-inline-start 会应用到元素的右边距上。

语法

/* Keyword value */
margin-inline-start: length;
margin-inline-start: auto;
margin-inline-start: inherit;
margin-inline-start: initial;
margin-inline-start: revert;
margin-inline-start: unset;

属性值

• length：数值表示您需要应用的 margin-inline-start，通常使用像素或em为单位。

• auto：如果指定为了'auto'，则页数据将会自动设置该元素的 margin-inline-start。

• inherit：如果指定为了inherit，则该元素将会从其父元素继承 margin-inline-start 值。

• initial：如果指定为了 initial，则该元素将会使用 margin-inline-start 的默认值。

• revert：如果指定为了 revert, 元素的 margin-inline-start 将会恢复为其父级元素的值

• unset：如果指定为了 unset, 元素的 margin-inline-start 属性将会重置，使用默认值或继承父级元素的值。

适用性

该属性适用于块级元素。例如，用于P、UL和OL等元素。

浏览器支持

该属性在所有主流浏览器中被支持。

示例

p {
  margin-inline-start: 50px;
}

结论

在处理水平方向上的内边距和外边距的时候，使用 margin-inline-start 属性可以避免排版方向不同造成的问题。这在多语言环境中非常有用，并且可以在RTL到LTR之间进行快速更改而不必担心内边距和外边距如何分配。

相信理解了 margin-inline-start 属性，你会在CSS布局中更自信和独立！