想找到一种有循环视频背景的方法.始终完全覆盖屏幕.它的工作方式是我想要的,但当我将vh和vw增加到100%时,它添加了滚动条,视频周围仍然有填充和边距.我怎样才能解决这个问题?
<section class="container">
<video class="fullscreen" src="comp1.mp4" playsinline autoplay muted loop>
</video>
<style media="screen">
video.fullscreen {
position: absolute;
z-index: 0;
object-fit: cover;
width:100%;
height:100%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
&::-webkit-media-controls {
display:none !important;
}
}
.container {
position: relative;
display: grid;
place-items: center;
margin: 0 auto;
height: 100vh;
width: 100vw;
background: #ccc;
}
.content {
z-index: 1;
}
body {
height: 100vh;
display: grid;
place-items: center;
}
</style>