首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >将全页图像背景替换为视频(HTML5)

将全页图像背景替换为视频(HTML5)
EN

Stack Overflow用户
提问于 2017-10-26 03:22:02
回答 1查看 131关注 0票数 0

用视频替换整页图像背景的最简单方法是什么?

代码语言:javascript
复制
video {
  position: fixed;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -100;
  transform: translateX(-50%) translateY(-50%);
  background: url('#.jpg') no-repeat;
  background-size: cover;
  transition: 1s opacity;
}
代码语言:javascript
复制
<video poster="#.jpg" id="bgvid" playsinline autoplay muted loop>
    <source src="#.mp4" type="video/mp4">
</video>

我使用了HTML5 UP的光谱模板,但不知道如何以最简单和最有效的方式将横幅背景替换为视频。(https://html5up.net/spectral)

非常感谢您提前:-)

EN

回答 1

Stack Overflow用户

发布于 2017-10-26 03:30:58

在页眉中,您可以在CSS --> #header中删除或替换页眉背景颜色

如果你是这个意思的话。

代码语言:javascript
复制
-moz-transition: background-color 0.2s ease;
-webkit-transition: background-color 0.2s ease;
-ms-transition: background-color 0.2s ease;
transition: background-color 0.2s ease;
//background: #2e3842; //delete or change this one
height: 3em;
left: 0;
line-height: 3em;
position: fixed;
top: 0;
width: 100%;
z-index: 10000;
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/46940524

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档