Question

我想删除视频中的黑色边框并保持其响应速度。我正在使用Bootstrap 4.5。我还想保持视频的全景分辨率1920x764。我几乎可以肯定，问题与解决方案有关。然后我应该编辑bootstrap .css文件吗？

       const mailRef = db.collection('mail')
        return mailRef.add({
            email: email,
            subject: 'Welcome'

        });

你知道我该如何解决吗？谢谢！

Answer 1

如我们所见，Bootstrap 4有一个embed aspect ratios的列表。此列表中.embed-responsive-21by9的比例通过BS CSS确定：

.embed-responsive-21by9::before {
  padding-top: 42.857143%;
}

看起来您的分辨率不是很标准。让我们向您的CSS（或Bootstrap）添加一个新类。可以说它将是.embed-responsive-19by7。 1920 = 100％，764 = 39.7916％（使用比例764 * 100/1920 = 36.79166 ）。因此，您的其他CSS是

.embed-responsive-19by7::before {
  padding-top: 39.7916%;
}

现在您的视频将是

<!-- panoramic - 19:7 aspect ratio -->
    <div class="d-none d-lg-block embed-responsive embed-responsive-19by7 cab-video">
        <video class="embed-responsive-item">
            <source src="video.mp4">
        </video>
    </div>

删除响应式视频Bootstrap 4中的黑色边框

1 个答案: