html - 背景图片不显示？

Question

好的，我已经将图像链接到网站的 div 部分。但是，一旦上传到服务器，图像将不会显示。我仔细检查了我的 CSS 文件，没有任何问题，但也许我遗漏了什么。

CSS:

div{
    background-image: url(/images/medical-marijuana-background.jpg);
    background-repeat: space;
    border: solid #0D8200 .15em;
}

HTML:

<div id="about">
<h2> About this website</h2>
<p>This page is dedicated to educating those who are interested in the medical benefits of marijuana as a medical option, and also to refute some of the misinformation about cannabis. As a  medical option, or even in general terms, cannabis is drastically under-researched. In fact in July of 2015 eight senators not only indicated that there is a lack of research on marijuana as a medical option, but also asked the Obama administration what is being done to further advance the reasearch.(<em> Medical marijuana research </em>, 2015) Ultimately, the purpose of this site is to not just educate, but also raise awareness. Raise awareness of the benefits of cannabis, raise awareness of the need to conduct more research/studies on cannabis as a medical option, and also give some history about cannabis.
</p>

有什么想法吗？

Answer 1

首先，您的 CSS 与您的 HTML 不匹配。在您的 HTML 中，您设置了 div id="about"。所以要在你的 CSS 中调用它，你必须写#about 而不是“div”，像这样:

#about {
background-image: url(/images/medical-marijuana-background.jpg);
background-repeat: space;
border: solid #0D8200 .15em;
}

其次，您对图片的调用不当。如果您的 .html 文件与您的图像位于同一目录中，您可以这样调用图像:

url(input.jpg)

如果图像位于 .html 下一级名为 images 的子文件夹中，那么您可以这样调用它:

url(images/input.jpg)

最后，如果您的图片实际上比您的 .html 高一级，并且在名为 images 的子文件夹中，您可以这样调用它:

url(../images/input.jpg)

希望这对您有所帮助!