该属性用来指定被定位元素的位置。绝对定位的元素,bottom 属性指定元素底边距边缘和包含该元素的容器的底边缘的距离。 相对定位的元素,bottom 属性指定元素的下边界距离其正常位置的距离。
/* <length> value */ bottom: 2.5em; /* <percentage> value */ bottom: 95%; bottom: auto; bottom: inherit;
值 | 描述 |
---|---|
<length> | 该关键词表示一个负值,空值或正值。 |
<percentage> | 该关键词表示包含块高度的百分比。 |
auto | 此关键词表示在为绝对定位的元素时,自动视为一个基于内容的高度。相对定位的元素时,从其原始位置的元素的偏移量基于 top 属性。 |
inherit | 此关键词表示值来自父元素的计算值。 |
HTML
<div id="red"> <div id="orange"></div> </div>
CSS
#red { width: 200px; height: 200px; background: red; position: relative; } #orange { width: 50px; height: 50px; float: right; background: orange; position: absolute; bottom: 20px; }
执行结果