html - 如何在内部div上方显示背景图像

Question

我想在内部 div 上方显示背景图片。我怎样才能做到这一点？

这是一个code pen ，我的代码如下所示。

.adv-signup {position: relative;  background: #ffffff url("https://s6.postimg.cc/ugw1p1pcx/sprite.png ") no-repeat left top;
  width: 1000px; height: 500px;}

	
.contents {position: absolute; background: blue; width: 800px; height: 200px;top: 20px; left: 30px; }

<div class="adv-signup">
        <div class="contents">
            <div class="text">
                <h3>Sign up for E-News</h3>
                <p>Leave your email and we’ll send you regular updates on programs, events and news.</p>
            </div>

            <div class="controls">
                <input name="adv-sign-up-email-field" id="adv-sign-up-email-field" type="text" maxlength="255" value="Enter your email" />
                <a href="#" class="btn"></a>
            </div>
        </div>
<div>

Answer 1

这就是“背景图片”的意义所在，不是吗:P 那是在背景中，而不是在前景中。

尝试这样的事情:

<nav>
  <img src="">
<nav>
<div class="contents">
  ...
</div>