适用于非移动设备的HTML5视频和适用于移动设备的图像

如果屏幕大于992px，我想播放视频；如果屏幕较窄，我想播放图像。 是否可以仅在HTML中执行此操作

我的代码：

<video autoplay="" preload="auto" loop="true" muted="" >
    <source media="(min-width: 992px)" srcset="/images/gifs/video.mp4" >
    <img src="/images/gifs/image.jpg">
</video>

---

不确定是否可以隐藏源本身，或者是否必须隐藏视频标签。 否则，请尝试将img移到视频标记之外，并在CSS中使用以下内容，并将ID添加到视频/图像中：

@media (max-width: 991px) {
#video-id {
display: none; }
}

@media (min-width: 992px) {
#image-id {
display: none; }
}