Html Bootstrap 4通过控件嵌入响应视频

我使用的是Bootstrap4的响应嵌入式视频功能，它在视频上运行得很好，但不缩放控件（暂停、播放等）。控件是否不可伸缩，或者代码中是否缺少某些内容

    <div id="trailer" class="section d-flex justify-content-center embed-responsive embed-responsive-4by3">
      <video class="embed-responsive-item" controls>
        <source src="assets/TMMTrailer18.mp4" type="video/mp4">
        Your browser does not support the video tag.
      </video>
    </div>

您的浏览器不支持视频标记。

---

谢谢

视频具有固定的纵横比Bootstrap这里允许我们调整视频的宽度和高度，以尽可能多地跨越空间，而无需更改此比率。但是，如果我们没有选择具有适当纵横比（

高度或宽度）的“
类
”，则无所谓，以先达到
100%
的为准

这会导致视频从底部或顶部居中，或从右侧或左侧居中

事实上，这就是像Youtube和Vimeo这样的流行平台所做的。他们只是将背景颜色设为黑色，希望给人一种感觉，即控制按钮周围有一个播放器

这里需要做的是将
背景色设置为黑色

例如，21by9类和16by9视频

。嵌入响应项{
背景色：黑色；
}

您的浏览器不支持视频标记。