可以通过以下几种方式实现:
<style>
.container {
display: flex;
flex-direction: column;
align-items: flex-end;
}
</style>
<div class="container">
<div>这是一个div</div>
<button>按钮</button>
</div>
推荐的腾讯云相关产品:腾讯云云服务器(CVM),产品介绍链接地址:https://cloud.tencent.com/product/cvm
<style>
.container {
position: relative;
}
.button {
position: absolute;
bottom: 0;
}
</style>
<div class="container">
<div>这是一个div</div>
<button class="button">按钮</button>
</div>
推荐的腾讯云相关产品:腾讯云云服务器(CVM),产品介绍链接地址:https://cloud.tencent.com/product/cvm
<style>
.container {
display: grid;
grid-template-rows: auto auto;
}
.button {
align-self: end;
}
</style>
<div class="container">
<div>这是一个div</div>
<button class="button">按钮</button>
</div>
推荐的腾讯云相关产品:腾讯云云服务器(CVM),产品介绍链接地址:https://cloud.tencent.com/product/cvm
以上是将按钮与div底部对齐的几种常见方法,具体选择哪种方法取决于实际需求和布局结构。腾讯云云服务器(CVM)是一款可靠、可扩展的云计算产品,适用于各种应用场景,提供高性能的计算能力和稳定可靠的云服务器实例。
领取专属 10元无门槛券
手把手带您无忧上云