HTML/CSS - 背景图像未显示在浏览器中答案

【问题标题】：HTML/CSS - Background image not showing up in browserHTML/CSS - 背景图像未显示在浏览器中
【发布时间】：2013-11-23 03:17:39
【问题描述】：

我真的不知道我在这里做错了什么，似乎找不到解决方案。路径是正确的，图像在正确的文件夹中。代码如下：

<html>

<head>
<link rel="stylesheet" type="text/css" href="style.css">
<title>COSMOSHOP</title>
</head>

<body>
</body>


</html>

和 CSS 代码：

body {
    background-image: url('images/nightsky.jpg');
}

【问题讨论】：

我可以获得一个 URL 来查看实际页面吗？代码可能没有找到文件的路径。
您是否尝试过在浏览器中直接转到图像所在的位置并查看显示的内容？
如果 body 为空你看不到它的背景，因为 height 为 0，尝试为 body 或一些内容添加高度。

标签： html css image background

【解决方案1】：

在浏览器中打开开发控制台并检查 url 是否正确。这很常见，有时却不是

【讨论】：

这不是答案

【解决方案2】：

有时 HTML/CSS 的问题是浏览器中的缓存。尝试按 ctrl + shift + delete，然后删除浏览器缓存。看看有没有帮助

【讨论】：

【解决方案3】：

根据提供的代码，您没有 <body> 内容。所以你的身体基本上是0像素高。尝试添加这个，你应该会看到你的背景图片（假设你的路径是正确的）。请注意，我只是为身体添加了一个高度，这样您就可以看到图像在那里。一旦您开始构建一个实际站点（即您的 <body> 中的内容），您就可以删除高度。因为在你的 body 标签上指定 height 属性是不好的做法。

body {
    background-image: url('images/nightsky.jpg');
    height: 600px; // remove this once you start adding content to the body
}

【讨论】：