Html 响应背景（视频背景和背景色）
我想知道是否有可能为屏幕（笔记本电脑992px）播放视频背景，为较小的设备播放没有视频的黑色背景 我已经制作了一个视频背景 HTML代码Html 响应背景（视频背景和背景色）,html,css,video,background,background-color,Html,Css,Video,Background,Background Color,我想知道是否有可能为屏幕（笔记本电脑992px）播放视频背景，为较小的设备播放没有视频的黑色背景 我已经制作了一个视频背景 HTML代码 <html lang="en"> <head> <meta charset="UTF-8"> <title>Login/Logout animation concept</title> <meta name="viewport" content="width=device-width, ini
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Login/Logout animation concept</title>
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=yes">
</head>
<body>
<header class="video-header container">
<div class="fullscreen-video-wrap">
<video src="https://s3.envato.com/h264-video-previews/35654d71-df62-4468-9680-6c0bf9a95ff2/12292237.mp4" autoplay="true" muted="true" media="screen and (min-width:800px)">
</video>
</div>
</header>
</body>
</html>
希望有人能帮我解决这个问题。提前谢谢你 只需使用媒体查询，为不同的屏幕设置不同的背景。
你好，安娜，谢谢你的回复。我看到了一个关于不同MediaQuery的不同背景颜色的示例。不幸的是，我没有看到从视频到纯色背景的例子。你能举例说明一下它应该是什么样子吗？在一定尺寸的显示器上，无视频无背景设置为无，背景颜色设置为黑色。
.video-header {
height: 100vh;
display: flex;
align-items: center;
color: #fff;
}
.container {
max-width: 960px;
padding: 0 10px;
margin: auto;
text-align: center;
}
.fullscreen-video-wrap {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100vh;
overflow: hidden;
}
.fullscreen-video-wrap video {
min-height: 100%;
min-width: 100%;
}