Question

对于我的生活，我无法使用CSS显示简单的背景图像。我有一个简单的HTML页面：

<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>My Website</title>
<LINK href="./css/styles.css" rel=StyleSheet  type="text/css">
</head>
<body>
<p>foo</p>
</body>
</html>

以下CSS页面：

body {
    background:url('./images/myBackground.jpg');
}

然而，图像从未显示过。我用Google搜索了这个问题，很多人似乎遇到了同样的问题，但没有一个解决方案有效。我已经尝试了我能想到的CSS语法的每种组合（背景，背景图像，没有引号，单引号，双引号，斜线，没有斜线等） - 没有运气。我已经尝试将图像放在与HTML页面相同的目录中 - 没有运气。我试过制作一个方形div并将其背景设置为这个图像 - 没有运气。我试过设定一个固定的高度和宽度 - 没有运气。

没有拼写错误，我知道图片没有任何问题，因为它使用HTML中的内嵌图片标记。 HTML和CSS页面是链接的，因为我可以执行类似

的操作

p {
    color: blue;
}

这是有效的。我错过了一些非常明显的东西吗？我可以内联，但我真的更喜欢使用CSS，现在我只想用顽固和校长来做。

Answer 1

您必须使用扩展名.png，.jpg，.gif等

   background:url('../images/myBackground.png');

 background:url('../images/myBackground.jpg');

Answer 2

你需要额外增加“。”在网址前面。

您现在正在链接到/ css / images / mybackground。

如果你多加一个“。”在它前面，像../images/myBackground （并添加如上所述的扩展名）

它应该工作。（至少在我的情况再现中。）

CSS背景图片不会显示

2 个答案: