CSS bottom 属性

将 div 元素的底边设置为其最近父元素底边上方10px的位置:

div.absolute {
position: absolute;
bottom: 10px;
width: 50%;
border: 3px solid #8AC007;
}

定义和用法

bottom 样式属性定义了定位元素下外边距边界与其包含块下边界之间的偏移，非定位元素设置此属性无效。

bottom的效果取决于元素的position属性:

当position设置为absolute或fixed时，bottom属性指定了定位元素下外边距边界与其包含块下边界之间的偏移。
当position设置为relative时，bottom属性指定了元素的下边界离开其正常位置的偏移。
当position设置为sticky时，如果元素在viewport里面，bottom属性的效果和position为relative等同；如果元素在viewport外面，bottom属性的效果和position为fixed等同。
当position设置为static时，bottom属性无效。

表中的数字表示支持该属性的第一个浏览器版本。

属性
bottom	1.0	5.0	1.0	1.0	6.0

bottom: auto|length|initial|inherit;

值	描述	试一试
auto	默认值。通过浏览器计算底部的位置。	亲自试一试 »
length	使用 px、cm 等单位设置元素的底边位置。可使用负值。阅读长度单位	亲自试一试 »
%	设置以包含元素的百分比计的底边位置。可使用负值。	亲自试一试 »
initial	将此属性设置为其默认值。请参阅 initial	亲自试一试 »
inherit	从其父元素继承此属性。请参阅 inherit