bottom

该属性用来指定被定位元素的位置。绝对定位的元素，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;
}

执行结果

参考

相关链接

外部链接


跳至内容顶部