HTML5视频海报图片不能在iPad视网膜上全屏缩放

Question

我在网站上有一个全屏视频。在iPad上我想加载海报图像，所以它也是全屏的。标记和CSS我在低分辨率iPad Mini上工作，但在iPad Retina上没有显示全屏。

HTML ...

$  python manage.py migrate --fake-initial your_app_label

这是视频元素上的css ......

    <video autoplay poster="/images/styles/vid_home_screenshot.jpg" id="bgvid" loop>
        <source src="/video/Globe_vid_main_1280x720_v4.mp4" type="video/mp4" />
        <source src="/video/Globe_vid_main_1280x720_v4.webm" type="video/webm" />
        <source src="/video/Globe_vid_main_1280x720_v4.ogv" type="video/ogg" />     
    </video>

Answer 1

position: fixed;
bottom: 0;
min-width: 100%;
min-height: 100%;
width:auto;
height:auto;
z-index: -100;
background-size: cover;
-webkit-background-size:cover; 
-moz-background-size:cover; 
-o-background-size:cover; 
background-size:cover;
left: 50%;
transform: translate(-50%,0);
-webkit-transform: translate(-50%,0);