css 有谁知道为什么背景图片不显示?

plicqrtu  于 2023-05-02  发布在  其他
关注(0)|答案(2)|浏览(138)

嗨,我正在创建一个网站以下的教程,并卡住了(哈哈)。我不知道为什么背景图像不显示。尝试重命名类等,但没有任何工作。谁能给予我一点提示?

.site-main .subscribe-us-area .subscribe {
  background: url(/img/subscribe-bg.png) no-repeat;
  padding: 10rem 0;
  margin: 3rem auto;
}

<section class="subscribe-us-area">
  <div class="container subscribe">
      <div class="row">
          <div class="col-lg-12 text-center subscribe-title">
              <h4 class="text-uppercase">Get Update From anywhere</h4>
              <p class="para">Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam,
                  consequuntur.</p>
          </div>
      </div>
      <div class="d-sm-flex justify-content-center">
          <form class="w-50">
              <div class="row d-flex flex-row flex-wrap">
                  <div class="col input-textbox">
                      <input type="text" id="txtemail" class="form-control" placeholder="Email">
                  </div>
                  <div class="col">
                      <div class="btn-submit">
                          <button type="submit" class="btn btn-success float-right">Subscribe</button>
                      </div>
                  </div>
              </div>
          </form>
      </div>
  </div>
</section>

我希望图像显示在背景中

h22fl7wq

h22fl7wq1#

我能够让@Tasye提供的代码工作(添加。在URL的前面)。我还必须将the class=“site-main”添加到div中。它看起来像这样:

<style>
  .site-main .subscribe-us-area .subscribe {
   background: url(./img/subscribe-bg.png) no-repeat;
   padding: 10rem 0;
   margin: 3rem auto;
  }
  </style>
<body class="site-main">
  <section class="subscribe-us-area">
     <div class="container subscribe">
        <div class="row">
           <div class="col-lg-12 text-center subscribe-title">
             <h4 class="text-uppercase">Get Update From anywhere</h4>
             <p class="para">Lorem ipsum dolor sit amet consectetur adipisicing elit. Laboriosam,
              consequuntur.</p>
           </div>
        </div>
        <div class="d-sm-flex justify-content-center">
          <form class="w-50">
            <div class="row d-flex flex-row flex-wrap">
              <div class="col input-textbox">
                  <input type="text" id="txtemail" class="form-control" placeholder="Email">
              </div>
              <div class="col">
                  <div class="btn-submit">
                      <button type="submit" class="btn btn-success float-right">Subscribe</button>
                  </div>
              </div>
            </div>
          </form>
       </div>
    </div>
  </section>
</body>
ecr0jaav

ecr0jaav2#

试着这样做:

.site-main .subscribe-us-area .subscribe {
     background: url("./img/subscribe-bg.png") no-repeat;
}

从mozilla看这个文档

相关问题