背景视频高度不工作

这是我的CSS：背景视频高度不工作

video { 
    position: absolute; 
    min-height: 100%; 
    height: 100%; 
    z-index: -100; 
    width: 980px; 
    min-width: 980px; 
}

这是我的HTML：

<video playsinline autoplay muted loop> 
    <source src="https://video.wixstatic.com/video/11062b_155feccf8d494b18b70adcd7716b6646/1080p/mp4/file.mp4" type="video/mp4"> 
</video>

我在后台使用这个视频它的父位置是相对的，宽度为980px但高度100％不起作用。

来源

2017-02-01 Rizwan Mughal

是否要设置全屏幕背景视频？或宽度980px和宽度100％？ –

包裹在一个div <video>并设置<video>，<div>，<body>和<html>到width:100%和height:100%。它应该显示完美的视频边缘到边缘而不会在任何尺寸下裁剪或变形。

代码片段

html, body { 
 
    height:100%; 
 
    width: 100%; 
 
    box-sizing:border-box; 
 
    margin:0; 
 
    padding:0; 
 
    } 
 
.frame { 
 
    position:relative; 
 
    height: 100%; 
 
    width:100%; 
 
} 
 
video { 
 
    position: absolute; 
 
    height: 100%; 
 
    width: 100%; 
 
    z-index: -100; 
 
}

<div class='frame'> 
 
<video playsinline autoplay muted loop> 
 
    <source src="https://video.wixstatic.com/video/11062b_155feccf8d494b18b70adcd7716b6646/1080p/mp4/file.mp4" type="video/mp4"> 
 
</video> 
 
    </div>

来源

2017-02-04 09:46:00 zer00ne

<div class="row" style="text-align:center"> 
    <video playsinline autoplay muted loop> 
     <source src="https://video.wixstatic.com/video/11062b_155feccf8d494b18b70adcd7716b6646/1080p/mp4/file.mp4" type="video/mp4"> 
    </video> 
</div> 

video { 
    position: relative; 
    min-height: 100%; 
    height: 100%; 
    z-index: -100; 
    width: 980px; 
    min-width: 980px; 
}

来源

2017-02-04 10:14:29 sneha

不知道什么是在家长，以下为我工作。

<style> 
body, video { 
    width: 100%; 
    height: 100%; 
    margin: 0; 
    padding: 0; 
} 
</style> 
<body> 
    <video autoplay loop> 
    <source src="https://video.wixstatic.com/video/11062b_155feccf8d494b18b70adcd7716b6646/1080p/mp4/file.mp4" type="video/mp4"> 
    </video> 
</body>

来源

2017-02-04 10:37:41

背景视频高度不工作

回答

相关问题