出现在所有浏览器中的图像，但 Firefox答案

【问题标题】：Images appearing in all browsers but firefox出现在所有浏览器中的图像，但 Firefox
【发布时间】：2018-12-17 16:56:40
【问题描述】：

我有一个网站在 chrome 中显示正常，但在 Firefox 中显示不正常。

这是铬：

这是火狐：

四个主图像中的三个丢失了 - 奇怪的是第四个显示正常，尽管代码相同。检查器显示图像下载成功：

我也清除了缓存，更新了火狐等，都无济于事。

回答问题：

所有图片均来自数字海洋，而非本地。

这是学习图像和微笑图像的css和html，其中微笑图像出现在FF中，而学习按钮没有：

CSS

    .four_box {
        position: absolute;
    }

    .four_btn {
        cursor: pointer;
        transition: all .7s;
    }

    .four_label_anchor {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        position: absolute;
        top: 0;
        left: 0;
        pointer-events: none;
    }

    .smile_size {
        height: 262px;
        width: 326px;
    }

    .learn_size {
        height: 263px;
        width: 183px;
    }

HTML

<div id="learn" class="learn_size four_box" style="top: 437px; left: 771px;">
    <img id="learn_btn" class="learn_size four_btn" style="
     background: url(/static/img/swirl_home/chalk-btn.png);"
     onclick="animHome(this.id);">

    <div class="learn_size four_label_anchor">
        <div id="learn_label" class="four_label">Learn</div>
            <button id="learn_return" class="btn_href return_btn">
                return
            </button>
        </div>
    </div>
 </div>

<div id="smile" class="smile_size four_box" style="top: 438px; left:     954px;">

   <img id="smile_btn" class="smile_size center four_btn" style="
        background: url(/static/img/swirl_home/bird-btn.png);"
        onclick="animHome(this.id); homeSnapshots();">

   <div class="smile_size four_label_anchor">

       <div id="smile_label" class="four_label">Smile</div>
            <button id="smile_return" class="btn_href return_btn">
                return
            </button>

       </div>
 </div>

我会重读火狐链接

【问题讨论】：

你能给我们一个显示图像的代码吗？您是否还清除了 Chrome 缓存，或在 Chrome 隐身模式下查看了您的网站？最好用2个浏览器的情况对比一下……

标签： image google-chrome firefox cross-browser

【解决方案1】：

如果您显示的是本地图像，则可能是问题所在。

在图片 URL 中使用 / 而不是 \ 将解决问题

否则，Mozilla 有一个针对此类问题的通用帮助页面：https://support.mozilla.org/en-US/kb/fix-problems-images-not-show

【讨论】：

这个不行。