背景視頻高度不工作

這是我的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

背景視頻高度不工作

回答

相關問題