Question

我试图为网页标题创建一个全宽的视频封面，但它仍然在窃听，我做错了什么？

这是我的代码的一部分：

<section id="home">
        <video poster="assets/img/home-bg.png" autoplay="autoplay" loop="loop" id="bgvid">
            <source src="assets/video/garage-video.mp4"" type="video/mp4"/>
         <!--  <source src="assets/video/trailer.webm" type="video/webm"/> --> 
        </video>

        <!-- HEADER LOGO & NAV -->
        <div class="filtro">

            <div class="logo">
            <img src="assets/img/garage-logo-blanco.png" alt="logo garage">
        </div>

这是css：

section#home video {
    position: absolute;
    top: 0;
    left: 0;
    min-width: 100%;
    min-height: 100vh;
    width: 100%;
    height: 100vh;
    object-fit: cover;
    z-index: 1;
}

.filtro {
    z-index: 2;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(40, 88, 162, .55);
}

这是整个代码：

https://github.com/Luisbtz/garage3.0

这里是你可以找到错误的演示，（额外的右边填充）：

http://luisbenitez.xyz/garage3.0/

Answer 1

您的问题不在video中，而在HTML的其他部分，在此处：

section#confiables .mecanico-img .left {
  left: 20vh;
  position: relative;
  top: 30vh;
}

删除left:20vh

我的全宽视频封面我做错了什么？

1 个答案: