Firefox,

时间:2017-02-27 22:13:34

标签: html css google-chrome background-image mozilla

我正在尝试使用Dreamweaver将背景图像加载到页面。它显示在IE和Edge中,但不显示Chrome或Mozilla。我已经尝试移动照片的位置(文件路径)并尝试使用直接HTML和CSS同样的结果。我找不到另一种方法来编写代码或想到一个代码(对此非常新),以便它将在所有浏览器中显示。这是CSS代码:

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),这些点完全让我困惑。我想也许我需要有关文件路径如何工作的帮助。

3 个答案:

答案 0 :(得分:1)

这是因为在Firefox和Chrome浏览器中实现了body和html标签。正文和HTML标记只与它们的HTML内容一样大。在Edge和IE中,HTML和Body的大小自动调整为视口大小。

将此添加到您的CSS

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

答案 1 :(得分:0)

好的,所以如果你的代码是正确的,并且它在IE和edge中显示的图像试着

使用此命令刷新浏览器但不正常: Control + Shift + R

这样您就可以确保运行该网络的最新版本

网站的服务。

答案 2 :(得分:-1)

首先,您需要确保浏览器正确定位图像。

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

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

但是,如果成功加载,则图像不会显示其他原因。没有看到你的所有代码,我只能猜测。容器中的图像是否为空?如果没有内容或指定的高度,背景图像将不会在某些浏览器中显示。