首页 > 解决方案 > 如何在bootstarp4中使大图像不被绘制到我们想要的高度

问题描述

我想在引导程序(图像叠加)中制作一个像卡片一样的大图像,但是图像太大而且我想要的高度..这是我所做的:在此处输入图像描述

html:

<section class="card bg-dark no-border">
        <div class="flex-column justify-content-center align-items-center bg-danger text-dark">
            <img class="card-img img-fluid" src="img/bg_1.jpg" alt="Card image">
            <div class="card-img-overlay text-center m-auto">
                <h5 class="card-title mt-3">Card title</h5>
                <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional
                    content. This content is a little bit longer.</p>
                <p class="card-text">Last updated 3 mins ago</p>
            </div>
        </div>
    </section>

有没有人知道用 flex 使文本居中的更好方法?..我为此使用了边距,但这样做会更好。

标签: htmlimagebootstrap-4flexboxbootstrap-cards

解决方案


我觉得你只是一张分辨率不好的照片


推荐阅读