实现子div在父div的底部

最新推荐文章于 2023-05-29 09:54:42 发布

Michael_Lbs

最新推荐文章于 2023-05-29 09:54:42 发布

阅读量8.9k

点赞数 1

分类专栏： css

css 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

转自:出处

·思路及要点：

父div的位置设置成相对的，即“position: relative;”。
而子div的位置设置成绝对的，并且下边缘设为0，即“position: absolute; bottom: 0;”。

· 代码：

<head>
    <title>子div在父div中置底</title>
    <style type="text/css">
        .father { width: 500px; height: 600px; position: relative; background-color: AliceBlue; }
        .child { width: 400px; height: 100px; position: absolute; bottom: 0; background-color: AntiqueWhite; }
    </style>
</head>
<body>
    <div class="father">
        <div class="child">
        </div>
    </div>
</body>
</html>

优惠劵

Michael_Lbs

关注关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
实现子div在父div的底部

转自:出处·思路及要点：父div的位置设置成相对的，即“position: relative;”。而子div的位置设置成绝对的，并且下边缘设为0，即“position: absolute; bottom: 0;”。 · 代码：子div在父div中置底 .father { width: 500px; hei
复制链接

扫一扫