div在移动的背景图像

我有一个背景图像的DIV。在电脑上它看起来不错，但是当我进入移动设备时它确实放大了？div在移动的背景图像

这里是我的HTML和CSS代码：

.vh { 
 
    width: 100vw; 
 
    height: 100vh; 
 
    position: absolute; 
 
    background: url("http://autohof.coersonline.nl/wp-content/uploads/2016/09/Headerplaat-4.jpg") no-repeat center center fixed; 
 
    -webkit-background-size: cover; 
 
     -moz-background-size: cover; 
 
     -o-background-size: cover; 
 
     background-size: cover; 
 
}

<div class="vh"> 
 
</div>

感谢您的时间！

来源

2016-11-25 hans kazan

尝试'背景尺寸：100％' –

@PrasathV当我做到这一点上移动图像显示犯规。 –

你有没有设置元标记''？ –

您可能面临的问题是iOS Safari中带有视口单元的已知错误。尽量避免使用这些或使用this plugin来解决它。

来源

2016-11-25 09:08:11 Alvaro

使用以下CSS，背景将对高度做出响应。

background-image: url('YOUR_IMAGE'); 
background-repeat: no-repeat; 
background-size: contain; 
background-position: center;

html, 
 
body { 
 
    height: 100%; 
 
    width: 100%; 
 
} 
 
.vh { 
 
    height: 100%; 
 
    width: 100%; 
 
    background: url("http://autohof.coersonline.nl/wp-content/uploads/2016/09/Headerplaat-4.jpg"); 
 
    background-repeat: no-repeat; 
 
    background-size: contain; 
 
    background-position: center; 
 
    -webkit-background-size: cover; 
 
    -moz-background-size: cover; 
 
    -o-background-size: cover; 
 
    background-size: cover; 
 
}

<!doctype html> 
 
<html> 
 

 
<head> 
 
    <meta name="viewport" content="width=device-width"> 
 
</head> 
 

 
<body> 
 
    <div class="vh"> 
 
    </div> 
 
</body> 
 

 
</html>

来源

2016-11-25 09:09:24

div在移动的背景图像

回答

相关问题