Question

我制作了一个空的div元素以提供背景图片，但背景图片未显示...

HTML：

<header>
    <nav>
        <ul>
            <li class="no">Meer informatie</li>
            <li class="no">Bestemmingen</li>
            <li>Mijn vlucht</li>
            <li><a href="index.html"><img src="images/logo.jpg" alt="yo"></a></li>
            <li>Mijn verhalen</li>
            <li class="no"> Over wowair</li>
            <li class="no">Wow Contact</li>
        </ul>
    </nav>

 <div></div>
</header>

CSS：

  header div{
    background-image: url(../images/haikudesk.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 50em;
    height: 10em;
}

Answer 1

此功能Pen正常工作，您确定图片网址正确吗？

<header>
    <nav>
        <ul>
            <li class="no">Meer informatie</li>
            <li class="no">Bestemmingen</li>
            <li>Mijn vlucht</li>
            <li><a href="index.html"><img src="images/logo.jpg"                                   `              alt="yo"></a></li>
            <li>Mijn verhalen</li>
            <li class="no"> Over wowair</li>
            <li class="no">Wow Contact</li>
        </ul>
    </nav>

 <div></div>
</header>

header div{
    background-image: url('https://wiki.mozilla.org/images/d/d9/Webdev_code.png');
    background-repeat: no-repeat;
    background-position: center;
    width: 50em;
    height: 10em;
}

Answer 2

尝试将网址用引号引起来：

header div {
  background-image: url('../path/here');
}

div中的背景图片不显示

2 个答案: