HTML DIV层内对齐

2.DIV层内对齐

DIV怎么相对父DIV底部对齐

比如这样:


<style type="text/css">
.box1 {border:1px #cccccc solid;   500px; height:600px;}
.box2 {border-top:1px #cccccc solid; border-bottom:1px #cccccc solid; background:#f2f6fb; 500px; height:22px;}
</style>
<div class="box1">
     <div class="box2">我要怎么才可以对齐底部</div>
</div>


实现对齐底部:


<style type="text/css">
.box1 {border:1px #cccccc solid;   500px; height:600px;position:relative;}
.box2 {border-top:1px #cccccc solid; border-bottom:1px #cccccc solid; background:#f2f6fb; 498px; height:22px; position:absolute; bottom:10;}
</style>
<div class="box1">
     <div class="box2">我对齐底部了</div>
</div>
position:relative; 想让嵌套层以父层为参考定位,主要是这个属性,父div相对定位,然后子div再用绝对定位就可以了
position:absolute; bottom:10;相对于父对像.10象素.

原文地址:https://www.cnblogs.com/hakuci/p/1911169.html