调整大小时，Bootstrap 4 轮播字幕消失

Question

使用 Bootstrap 4。本质上，我有一个轮播，它在一系列不同的项目功能（带标题的 GIF）中循环。我根据 SO 上其他地方的一些代码有下面的标题。

在中/大屏幕上完美运行，但一旦屏幕太小，字幕就会完全消失。如何在较小的屏幕上保留字幕？

<div class = "carousel-inner">
<div class = "carousel-item active">
  <img class = "d-block carousel-image" src = "assets/translate-trimmed.gif" alt = "GIF of Sketchy translating objects.">
  <div class = "carousel-caption d-none d-md-block">
     <h5 class = "feature-name">Translate</h5>
     <p class = "feature-detail">
        Using the "Select Shape" option, user can move shapes around the canvas. Translation is controlled by dragging the mouse across the screen.
     </p>
  </div>
</div>
<div class = "carousel-item">
  <img class = "d-block carousel-image" src = "assets/raise-lower-trimmed.gif" alt = "GIF of Sketchy raising/lowering layers.">
  <div class = "carousel-caption d-none d-md-block">
     <h5 class = "feature-name">
        Raise/Lower
     </h5>
     <p class = "feature-detail">
        The "Raise" and "Lower" buttons can move shapes up or down in the list of layers. Layers are preserved even after saving/loading.
     </p>
  </div>
</div>

对于 CSS，我使用了以下相关的东西：

.carousel-item .carousel-caption {
 position: static;
 padding-top: 20px;
 padding-bottom: 20px;
 text-align: center;
   margin-bottom: 10px;
}

Any ideas? I can provide more code but the project is pretty long and I don't think anything else is messing with it.  

Answer 1

回答了我自己的问题！需要从“carousel-caption”类的每个 div 中删除 d-md-block 和 d-none。请参阅here 了解更多信息。