#left

#介绍

left 属性定义了定位元件的左外边距边界与其包含块左边界之间的偏移，非定位元件设置此属性无效。定位元件参考 position。

left 的效果取决于元件的 position 属性：

• 当 position 设置为 absolute 或 fixed 时，left 属性指定了定位元件左外边距边界与其包含块左边界之间的偏移。

• 当 position 设置为 relative 时，left 属性指定了元件的左边界离开其正常位置的偏移。

当 left 和 right 同时指定时，元件的位置会被重复指定。当容器是从左到右时，left 的值会被优先设定；当容器是从右到左时，right 的值会被优先设定。

#使用示例

css-apisrc/left/App.tsx

Code

预览

#语法

/* <length> values */
left: 3px;
left: 2rpx;
left: 2.4em;
left: 3rem;
left: 10%;

/* Keyword value */
left: auto;

/* calc */
left: calc(1px + 1px);

#取值

#auto

默认值。

#<length>

可以是负的，正的或者 null <length> 表示：

• 对于绝对定位的元件，元件左外边距边界与其包含块左边界之间的偏移。

• 对于相对定位定位的元件，元件的左边界离开其正常位置的偏移。

#<percentage>

使用外层元件的容纳区块宽度（the containing block's width）的百分比定义宽度。

#形式定义

#形式语法

left =
  auto                 |
  <length-percentage>  |

<length-percentage> =
  <length>      |
  <percentage>

#兼容性