Question

我在video标签中有一个视频，我需要添加另一个视频以提高响应速度，但是我不希望将其设置为背景。我正在使用bootstrap 4轮播。

这是我的HTML：

<div class="carousel-item active" >
 <video autoplay loop muted id="myVideo">
  <source src="videosource.mp4" type="video/mp4">
 </video>  
</div>

这是我的CSS：

.carousel-item{
    height:100vh;
}
#myVideo {
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
}

Answer 1

“我需要添加其他视频以提高响应速度”



“因为从移动设备或模板上观看当前视频时，主要角色被裁剪掉了”

您可以尝试调整视频大小以始终适合屏幕显示。

下面的示例代码是否可以帮助您考虑新的解决方案？将其设置为新的HTML页面，然后测试桌面窗口的大小调整并在移动设备上进行测试。

<!DOCTYPE html>
<html>

<style> .full-height-test { height: 95vh;} </style>

<body>

<div class="carousel-item active"  >
    <video  controls autoplay muted id="myVideo" class="full-height-test" >
    <source src="videosource.mp4" type="video/mp4">
    </video>  
</div>

</body>
</html>

在CSS中为其他视频添加视频源

1 个答案: