div的背景IMG未显示。使用Firefox Dev工具，它说该图像无法加载。但是，如果我使用IMG标签链接到图像，则可以正常工作。我宁愿使用背景属性在CSS中显示图像。对于我的文件结构，我有一个嵌套在项目文件夹中的IMG，CSS和JS文件夹。路径有问题，因为我在CSS文件夹中试图链接到另一个文件夹中的文件？
@charset "utf-8";
/* CSS Document */
.container {
}
.hero {
background: url('img/15827396293_fc1e0f749d_o%20(2).jpg') 0 0 no-repeat;
text-align: center;
background-size: cover;
}<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="css/style1.css" />
</head>
<body>
<div class="container">
<div class="hero">
<h1> This is a test</h1>
</div>
</div>
</body>
</html>如果您在CSS文件夹中，则正在寻找css/img/file.jpg。如果您不愿保持相对路径，则需要将图像路径更改为../img/file.jpg。我建议使用绝对路径，但这取决于您。有了绝对的道路，您不必担心您是否意外忘记了椭圆。
尝试" .."向上移动文档树
.hero {
background: url('../img/15827396293_fc1e0f749d_o%20(2).jpg') 0 0 no-repeat;
text-align: center;
background-size: cover;
}