CSS – 位置div到包含div的底部
我如何将一个div放到包含div的底部？
<style> .outside { width: 200px; height: 200px; background-color: #EEE; /*to make it visible*/ } .inside { position: absolute; bottom: 2px; } </style> <div class="outside"> <div class="inside">inside</div> </div> 此代码将文本“内部”放在页面的底部。
.outside { width: 200px; height: 200px; background-color: #EEE; /*to make it visible*/ }
需要是
.outside { position: relative; width: 200px; height: 200px; background-color: #EEE; /*to make it visible*/ }
绝对定位查找DOM中最近的相对位置的父对象，如果没有定义它将使用主体。
指定position:relative对于.outside ，然后position:absolute; bottom:0; position:absolute; bottom:0; 到你的.inside 。
像这样：
.outside { position:relative; } .inside { position: absolute; bottom: 0; }
添加position: relative对于.outside 。 （ https://developer.mozilla.org/en-US/docs/CSS/position ）
相对定位的元素仍被认为是文档中正常的元素stream。 相反，绝对定位的元素被从stream中取出，因此在放置其他元素时不占用空间。 绝对定位的元素相对于最近定位的祖先而定位。 如果定位的祖先不存在，则使用初始容器。
“最初的容器”将是<body> ，但添加上面使得.outside定位。
