该属性用于指定当前元素在有定位的包含块元素中的位置。对绝对定位的元素,它指向了元素左边界同其包含左边界之间的距离。
/* <length> value */ left: 2.5em; /* <percentage> value */ left: 95%; left: auto;
值 | 描述 |
---|---|
<length> | 该关键词表示负数,null,整数。对绝对定位元素,该值为到包含块元素左边界的距离。对于相对定位元素,若未被定义,该值为该元素相对正常文档流中的偏移量。 |
<percentage> | 该关键词表示包含块宽度的百分比。 |
auto | 此关键词表示关键字。对绝对定位元素,元素的定位基于right属性和指定的宽度,auto宽度值则基于容器大小来计算。对相对定位元素,其相对于原始位置的左偏移量是基于right属性来计算的。 |
HTML
<div id="red"> <div id="orange"></div> </div>
CSS
#red { width: 200px; height: 50px; background: red; position: relative; } #orange { width: 50px; height: 50px; background: orange; position: absolute; left: 30px; }
执行结果