无法使background-image:url工作

Question

我一直在尝试让图像与我正在处理的导航菜单一起工作。然而，似乎无论我尝试什么，它都不显示。

我试着添加了一些变体...

display:block;
background-position:top left;
clear:both;
list-style-image:url 

...from各种谷歌搜索。我是HTML/CSS的新手，所以如果能得到任何帮助或建议，我将不胜感激。作为参考，这里有一些我正在使用的HTML/CSS。

HTML

<div id="wrapper">
<div id="navigation">
<ul class="menu">
<li><a href="#">Forum</a></li>
<li><a href="#">Bookmarks</a></li>
<li><a href="#">Top 100</a></li>
<li><a href="#">Browse</a></li>
<li><a href="/">Home</a></li>
</ul>
</div>

CSS

#navigation .menu {
background-image:url ('images/gradient_nav.png');
border-top-style:solid;
border-top-color:#DDD;
border-bottom:2px solid #ddd;
border-top-width:2px;
height:50px;
margin-top:-5px;
clear:both;
}

我正在使用xampp在我的本地机器上工作，我的文件夹结构是：

htdocs\index.php
htdocs\css\style.css
htdocs\images\

提前感谢！

Answer 1

url必须与css文件相关，而不是与包含css的文件相关。您还没有提供有关文件夹结构的信息，但可能是这样的：

index.html
images/gradient_nav.png
css/stylesheet.css

如果是这样的话，url必须是../images/gradient_nav.png -结果如下：

#navigation .menu {
  background-image:url ('../images/gradient_nav.png');
  border-top-style:solid;
  border-top-color:#DDD;
  border-bottom:2px solid #ddd;
  border-top-width:2px;
  height:50px;
  margin-top:-5px;
  clear:both;
}