在Chrome浏览器中未显示背景图像，Firefox

我正尝试使用Dreamweaver将背景图像加载到页面。它在IE和Edge中显示，但不显示Chrome或Mozilla。我试图移动照片的位置（文件路径），并试图在直线HTML和CSS中得到相同的结果。我找不到另一种编写代码的方式，或者想到另一种方式（对此非常陌生），以便它可以在所有浏览器中显示。这是CSS代码：在Chrome浏览器中未显示背景图像，Firefox

background-image: url('file:///D:/website.com/httpdocs/pic/greenleaf.jpg')

设置在主体括号内;

和HTML：

<body background="file:///D:/website.com/httpdocs/pic/Demo Page Song Thumbnails/Jpeg Thumbnails/greenleaf.jpg">

我到处看看我找到的例子有省略号，像URL（... website.com/greanleaf.jpg）和点完全让我困惑。我想也许我需要帮助文件路径的工作方式。

来源

2017-02-27 riftvogel

您的项目中是否有assets/images路径文件夹？ – Nicholas

这是由于在Firefox和Chrome浏览器中实现了body和html标签。正文和HTML标签只有它们的HTML内容一样大。在Edge和IE中，HTML和Body的大小自动调整到视图端口的大小。

添加到您的CSS

body, html{ 
    min-height:100%; 
    min-width:100%; 
}

来源

2017-02-27 22:40:50

-1

首先，你需要确保浏览器的正确定位图像。

一个确定的方法是查看Chrome的网络选项卡。在Chrome中点击F12以显示开发者工具。点击网络标签，然后刷新浏览器。您将收到已加载/未加载的资源列表。如果您的图像以红色列出，则无法加载。你的问题将是一个不正确的路径。

这是理解相对文件路径的好资源。 https://css-tricks.com/quick-reminder-about-file-paths/

但是，如果它确实加载成功，图像不会显示另一个原因。没有看到你所有的代码，我只能猜测。你的图像是空的容器？没有内容或指定的高度，背景图片将不会在某些浏览器中显示。

来源

2017-02-27 22:42:44

可以找到图像，因为他声称它在IE和Edge中工作，它是一个路径问题，它不会在任何工作。 –

@MartinBarker，不错，但是由于OP使用绝对路径，可能是Firefox和Chrome阻止了这些。在开发人员工具中进行调查可能会发现本地文件是否被阻止。 – Dexter

更新您的答案以反映这一点，因为它不会是一个不正确的路径，这将违反安全策略。这正是我的意见和我的意见。 –

好了，如果你的代码是正确的，它在IE和边缘显示的图像尝试

刷新你的浏览器，但无法正常使用此命令：控制+ Shift + R键

使你一定会运行那个网站的最新最好的版本

网站的服务。

来源

2017-02-28 00:59:09 Nadim

在Chrome浏览器中未显示背景图像，Firefox

回答

相关问题