Question

我需要设置主要部分的封面背景图像。代码在所有浏览器中都运行正常，除了safari和ie9。

以下是代码：

CSS

.main{ 
background:#202020 url(../images/video-bg.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
float:left; width:100%;
padding-bottom:120px;
height:100vh;
min-height:100%;
max-height:100%;
top:0px;
bottom:0px;
}

HTML

<div class="main">
<!--[Start] Header-->
<header>
    <nav class="navbar navbar-default navbar-fixed-top">
        <div class="container-fluid">
            <div class="navbar-header">
                <a href="#" class="navbar-brand">Degetal Agency</a>
            </div>

            <div id="navbar">
                <ul class="nav navbar-nav navbar-right">
                    <li><a href="">Projects</a></li>
                    <li><a href="">Studio</a></li>
                    <li><a href="">Approach</a></li>
                    <li><a href="">Blog</a></li>
                    <li><a href="">Contact</a></li>
                </ul>   
            </div>
        </div>  
    </nav>

    <div class="col-xs-12">
        <div class="container-75">
            <div class="text-center">
                <div class="vcenter">
                    <h1>Digital solutions led by clarity, simplicity & honesty</h1>
                </div>  
                <div class="clearfix"></div>
                <a class="font18" href="javascript:void(0);">Learn More</a>
            </div>
        </div>          
    </div>
</header>
<!--[End] Header-->
</div>

请帮我解决safari中的问题，即

非常感谢您的反馈意见。

Answer 1

不要使用封面，请尝试根据屏幕方向使用100% auto或auto 100%。

封面图片没有设置在safari中，即9

1 个答案: