响应式全页视频，可以查询其他设备的其他编辑版本

Question

我正在尝试设置一个带有背景视频的主页，该页面可以随着浏览器扩大而获取不同的视频编辑。到目前为止，我已经能够创建完整的视频，并编辑了最初的视频以适合各种断点。

我知道，视频元素不接受SRCSET，并且已经搜索了很广泛。有人知道解决方案吗？

我正在采用移动优先的开发方法进行此操作，对于这种特定的视频工作，我想在768px，1200px＆amp;1600px

非常感谢

#myVideo    {
            z-index: -1;
              position: fixed;
              right: 0;
              bottom: 0;
              min-width: 100%; 
              min-height: 100%;
}

<video playsinline muted controls id="myVideo"
               src="video/COMP27home_loop_432x768.mp4" poster="images/home_loop_432x768_Moment.jpg">
          Your browser does not support HTML5 video.
            
        </video>

Answer 1

您必须阅读有关视频标签的文档。

https://developer.mozilla.org/en-us/docs/web/html/element/video

通过阅读文档，您可以找到他们的解决方案。您无需定义自定义样式或其他任何内容。