图片未在特定手机上显示答案

【问题标题】：Image not showing on specific mobile phone图片未在特定手机上显示
【发布时间】：2019-10-11 00:13:42
【问题描述】：

在某些移动设备上，页面顶部的图像没有显示。另一方面，徽标正在显示。区别在于图像和背景图像。没有出现的是背景图片。

div 具有高度和宽度以及背景颜色。因此，如果背景图像不工作，颜色应该是可见的，但它不是。

图片未显示在此特定手机上，其设置如下：诺基亚 8.1 铬 74.0.3729.157 安卓 9

在这里您可以找到打印屏幕诺基亚，所以没有图片：

Iphone，带图片：

我已将 .background 类的位置更改为相对而不是静态。和删除器 mix-blend-mode: multiply;

但没有任何效果。图像的高度显示，但它只是一个空白的空间。

<div class="header">
    <a class="logo" href="/">
        <img src="/images/logo.png" alt="">
    </a>
    <div class="background">
        <div class="mas"></div>
    </div>
</div>

.header{
    position: relative;
    .logo{
        color: black;
        text-transform: uppercase;
        font-weight: bold;
        font-size: 3.5em;
        letter-spacing: 5px;
        text-decoration: none;
        position: relative;
        z-index: 100;
        img{
            width: 120px;
            margin-bottom: 10px;
            margin-left: -22px;
        }
    }
    .background{
        position: relative;
        width: 100%;
        height: 300px;
        margin-top: 0;
        background: $baseColor;
        z-index: 50;
        .mas{
            width: 100%;
            height: 300px;
            margin-top: 40px;
            bottom: 0;
            top: auto;
            position: absolute;
            right: 0;
            background-image: url(/images/antwerpse_fluisteraar.jpg);
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
            opacity: 0.8;
        }
    }
}

【问题讨论】：

标签： html css mobile browser

【解决方案1】：

试试这个，希望对你有帮助

     .background{
        position: absolute;
        width: 100%;
        height: 300px;
        margin-top: 0;
        background: $baseColor;
        .mas{
            width: 100%;
            height: 300px;
            margin-top: 40px;
            position: relative;
            background-image: url(/images/antwerpse_fluisteraar.jpg);
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
           opacity: 0.8;
       }
   }

【讨论】：