背景視頻在div全部響應

Question

我正在尋找一個div的背景（聯繫人和頁腳格）的視頻。這是在我的全屏幕上工作，但在移動不是。

我的HTML是：

<div class="header-unit"> 
    <div id="video-container"> 
      <video autoplay loop class="fillWidth" > 
        <source src="videos/video_contactme.m4v" type="video/mp4" /> 
        Your browser does not support the video tag. I suggest you upgrade your browser.</video> 
      <h1>...</h1> 
      <p>some contents</p 
    </div> 
</div> 

和我的CSS是：

.header-unit { 
    height: auto; 
    width:100%; 
    overflow: hidden; 
    position:absolute; 
    margin-left:auto; 
    margin-right:auto; 
} 
video { 
    position: absolute; 
    z-index: 0; 
} 
video.fillWidth { 
    width: 100%; 
    min-height: 100%; 
} 
#video-container { 
    width:100%; 
    overflow: hidden; 
    background-size:cover 
} 

那麼，如何能我把它響應移動和iMac 27inch嗎？ （我尤斯引導）

Answer 1

這將讓你的存在方式的一部分：http://alistapart.com/article/creating-intrinsic-ratios-for-video

你的主要問題將是設備的方向。桌面是水平的，肖像移動是垂直的......但內在比例會讓你更接近你要找的比例。