CSS:如何定位元素在右下角?

前端之家收集整理的这篇文章主要介绍了CSS:如何定位元素在右下角?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我试图将文本元素“下注5天前”放在右下角。我该如何做到这一点?更重要的是,请解释一下,我可以征服CSS!

解决方法

假设你的HTML看起来像这样:
<div class="Box">
    <!-- stuff -->
    <p class="bet_time">Bet 5 days ago</p>
</div>

然后,使用CSS,您可以使该文本显示在右下角,如此:

.Box {
    position:relative;
}
.bet_time {
    position:absolute;
    bottom:0;
    right:0;
}

其工作方式是绝对定位的元素总是相对于第一相对定位的父元素或窗口定位。因为我们将框的位置设置为relative,.bet_time将其右边缘定位到.Box的右边缘,将它的底边定位到.Box的底边

猜你在找的CSS相关文章