html - 将背景图像放在 div 标签中

Question

我试图在跨越 h1、h2 和水平导航栏的 div 标记中显示图像作为背景。我的图像路径是正确的——我测试它作为 h1、h2 等的背景。但是，当它放在我的 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>

Answer 1

您已将图像放入“images”文件夹，因此您可能已将 css 放入“css”文件夹。

如果是这样，试试这个:

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

css 从它自己的相对路径调用背景图像...而不是使用 css 的页面的相对路径。

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