繁体   English   中英

手机上的背景图片拉伸或未显示

[英]Background image on mobile stretched or not showing

大家好
我真的不知道该怎么办了。 我已经阅读了所有主题,并尝试了几乎所有我认为可以使用的方法,但是没有任何效果!

事情就这样了:我的背景图片在我的手机(在本例中为iPhone 6S)上使用桌面浏览器BUT正常显示并调整其大小,但它却被拉伸了(看上去有些模糊)或根本不显示。

链接到我的页面(http://lauramaliqi.com/about.html)

我的代码(我添加了H1和p-以防万一它们影响上层代码。此代码还用于所有其他页面,它们的结果也与此相同。)

.top-bar-about { 
 color: #333;
 height: 350px;
 padding: 100px 0 10px;
 background: -webkit-linear-gradient( rgba(255, 255, 255, .8), rgba(255, 255, 255, .8)), url(../img/laura_background1.jpg);
background: linear-gradient( rgba(255, 255, 255, .8), rgba(255, 255, 255, .8)), url(../img/laura_background.jpg);
background-size: cover;
background-attachment: fixed;
background-position: center center;
text-align: center;}

.top-bar-about h1 { 
    font-size: 35px;
    font-weight: 400;
    color: #999;
    line-height: 50px;
    display: inline-block;
    text-align: center;}

.top-bar-about p { 
    font-size: 22px;
    font-weight: 300;
    color: #999;
    line-height: 10px;
    font-family:'Walter Turncoat', sans-serif;} 

我尝试更改背景附件:固定为滚动; 更改了背景图片大小,因为我在其中一则文章中读到了这也可能是问题所在。 与@media查询一起玩-没有结果。 放下没有重复,然后它与我的桌面图像弄乱了。基本上我尝试过的它都行不通。

补充一点,我知道有时缓存可能是浏览器中的错误,但是当我在手机上上传新文件时,我一直都删除缓存。.该死的图片只是没有反应。 它像冻结。

先感谢您!!

ps我也做了一些截图,以防万一

应该如何

应该如何

目前情况如何

目前情况如何

刚刚在我的iOS 10设备上检查并发现发生这种情况是由于

 background-attachment: fixed;

再试一次,然后将移动设备的值从“固定”更改为“滚动”:

@media (max-width: 991px) {

 .top-bar-about{
    background-attachment: scroll;
    padding: 254px 0px !important;
 }

}

并确保不缓存样式并且不要相互覆盖。

有背景附件:固定;

宽度背景附件:滚动;

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM