背景图像在断点处消失（引导程序）

Question

所以，你好世界我正在开始一个新的网页设计生涯，所以我遇到了第一个菜鸟问题，我试图在我的网页设计中并排放置图像和文本，但是当断点低于 560px 时，图像消失了，我不知道为什么, 我希望有人能帮助我这是德 CSS:

.proposito-img {
  background-image: url(../img/competencia.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  overflow: visible;
}

<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">

<div id="#proposito-1" class="container-md mt-5">
    <div class="row">
        <div class="col-md-6 proposito-img">

        </div>
        <div class="col-md-6 fondo-morado texto-blanco g-0 p-5">
            <h3 class="fw-bold texto-blanco">
                Proposito
            </h3>
            <p class="justificado">
                El estudiante fundamentará la importancia de la epistemología, (rama de la filosofía que
                investiga sobre el conocimiento científico y expresa en teorías el resultado de esas
                investigaciones). Con la finalidad de investigar los fundamentos de la educación como
                construcción social de la realidad y sobre la condición educable del hombre.
            </p>
        </div>
    </div>
</div>

Answer 1

.col-md-6是当屏幕宽度大于等于mdbreakpoint时占半屏的断点。再少一点，它就消失了！

Answer 2

我在 "proposito-img" 中添加了最小高度，因为 col- 属性在代码 (bootstrap).

中有 min-height:1px

.proposito-img {
background-image: url('https://images.unsplash.com/photo-1469317835793-6d02c2392778?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1352&q=80');
background-repeat: no-repeat;
background-size: cover;
background-position: center;
overflow: visible;
  min-height: 250px !important;
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>  

<div id="#proposito-1" class="container-md mt-5">
        <div class="row">
            <div class="col-md-6 proposito-img">

            </div>
            <div class="col-md-6 fondo-morado texto-blanco g-0 p-5">
                <h3 class="fw-bold texto-blanco">
                    Proposito
                </h3>
                <p class="justificado">
                    El estudiante fundamentará la importancia de la epistemología, (rama de la filosofía que
                    investiga sobre el conocimiento científico y expresa en teorías el resultado de esas
                    investigaciones). Con la finalidad de investigar los fundamentos de la educación como
                    construcción social de la realidad y sobre la condición educable del hombre.
                </p>
            </div>
        </div>
    </div>

背景图像在断点处消失（引导程序）

background image disappear on break point (bootsrap)

html

css

image

bootstrap-5