将一个背景图像放在一个div标签中

我试图在跨越h1，h2和水平导航栏的div标签中显示图像作为背景。我的图像路径是正确的 - 我测试了它作为h1的背景，只是h2等。但是，它放在我的div标签中时不会显示出来。此外，如果我尝试使用简单的颜色作为我的div标签的背景，那也不起作用。将一个背景图像放在一个div标签中

CSS：

#main{ 
    background-image:url("images/wall.png"); 
    position:relative; 
    width:100%; 
    height:100%; 
}

HTML：

<div id="main"> 
    <h1>Brian Buch</h1> 
    <h2>Pianist</h2> 
<div id="nav"> 
    <ul> 
     <li>recordings</li> 
     <li>calendar</li> 
     <li>bookings</li> 
    </ul> 
</div> 
</div>

来源

2014-11-08 bjorkland

它完美的工作。 http://jsfiddle.net/phLk84pm/可能有一些其他的CSS阻止背景图像显示出来。 – 2014-11-08 18:09:16

尝试为div添加背景颜色，以便您可以查看div本身是否可见。 – 2014-11-08 18:28:11

你把你的图像到 “图片” 文件夹中，因此很可能你已经把你的CSS的 “CSS” 的文件夹。

如果是的话，试试这个：

background-image:url("../images/wall.png");

的CSS是从自身的相对路径调用背景图片... 不是使用CSS页面的相对路径。

这将强制页面查看/ images目录，而不是/ css/images目录。

来源

2014-11-10 18:59:29 charliebowden

将一个背景图像放在一个div标签中

回答

相关问题