我试图让一个 HTML5 视频在background: center center fixed; background-size: cover;
不使用 JS 的情况下完全像一个元素一样运行(我知道有 JS 库可以做到这一点)。我想出了如何将宽度或高度设置为 100%,具体取决于窗口的纵横比与视频的纵横比相比,使用媒体查询(下面的示例假设您使用的是 16/9 视频)。我现在要做的就是让视频水平或垂直居中。
任何帮助,将不胜感激。
@media screen and (max-aspect-ratio: 16/9) {
div#fixed video {
position: absolute;
height: 100%;
z-index: -100;
}
}
@media screen and (min-aspect-ratio: 16/9) {
div#fixed video {
position: absolute;
width: 100%;
z-index: -100;
}
}