背景图像不起作用

Question

我在我的HTML中有这个,除了background-image之外一切都有效:'images/Header.jpg'; 相反,我看到标题中的灰色但不是图像..我尝试删除灰色但仍然没有看到图像...

#outerWrapper #header {
border-bottom: solid 1px #628152; 
font-size: 18px;
font-weight: bold;
line-height: 15px;
height: 115px;
background-color: Grey;
background-image: url('images/Header.jpg');

我怎样才能做到这一点..请帮忙..谢谢

Answer 1

CSS文件的路径和图像的路径是什么？

您必须考虑到,url()在CSS中使用时,路径是相对于CSS文件的,而不是相对于请求的页面.

想象一下,你有以下文件:

/website/index.html
/website/templates/main.css
/website/images/header.jpg

比CSS必须是:

.style{background-image:url(../images/header.jpg);} /* Noticed "../"? */

Answer 2

使用 Firefox 的Firebug查看您的页面。您可能没有正确加载图像。如果这是您的问题，您还可以即时使用 css。