我在將我的標題和CTA按鈕移到主圖片div的底部（或中心）時遇到了極大的挑戰，我使用的是最新的bootstrap 5.1，并嘗試了各種d-flex方法，但都沒有用。這是我的jsfiddle和我下面的代碼。
非常感謝任何幫助！
<div。
class="d-flex align-items-stretch mb-3 rounded shadow text-center bg-image img-fluid"
style="
background-image: url('https://mdbcdn.b-cdn.net/img/new/slides/041.jpg');
高度: 400px;
background-repeat: no-repeat;
Background-size: cover;
margin-top: -1rem !important;">
<div class="mask w-100"/span> style="background-color: rgba(0, 0, 0, 0. 6);">
<div class="d-flex justify-content-center">/span>
<!-- 本節需要放到底部-->
<div class="py-4 text-white"/span>>
<h1 class="mb-3">/span>歡迎來到工具中心! </h1>歡迎來到工具中心!
< a class="btn btn-outline-light btn-lg" href="{sites. url}}/puppies" role="button">查看我們最新的工具！</a>
</div>/span>
</div>/span>
</div>/span>
</div>/span>
uj5u.com熱心網友回復：
嘗試將d-flex align-items-center justify-content-center設定為帶有class=mask w-100的div，那么它下面的div就變得多余了。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/326611.html
標籤：