图像没有堆叠在功能部分后面？

Question

    .bo {
  transform: rotate(25deg);
  height: 600px;
  position: relative;
  padding-top: 80px;
  top: 100px;
  #features {
    margin: 50px;
    text-align: center;
    position: relative;
    z-index: 1;

<div class="row">
  <div class="col-lg-6  col-md-12">
    <h1 class="heading">Meet new and interesting dogs nearby.</h1>
    <button type="button" class="btn btn-dark btn-lg download-button"><i class="fab fa-apple"></i>
                    Download</button>
    <button type="button" class="btn btn-outline-light btn-lg download-button"><i class="fab fa-google-play"></i>Download</button>
  </div>

  <div class="col-lg-6  col-md-12">
    <img class="bo" src="images/iphone6.png" alt="iphone-mockup">
  </div>
</div>
</div>
</section>


<!-- Features -->

<section id="features">
  <div class="fluid-container">
    <div class="row">
      <div class="col-lg-4">
        <span class="icons"> <i class="fas fa-check-circle"></i> <br></span>


        <h3 class="tutorial">Easy to use.</h3>
        <p class="description">So easy to use, even your dog could do it.</p>
      </div>
      <div class="col-lg-4">

        <span class="icons"> <i class="fas fa-bullseye"></i> <br></span>

        <h3 class="tutorial">Elite Clientele</h3>
        <p class="description">We have all the dogs, the greatest dogs.</p>
      </div>
      <div class="col-lg-4">

        <span class="icons"> <i class="fas fa-heart"></i> </i> <br></span>

        <h3 class="tutorial">Guaranteed to work.</h3>
        <p class="description">Find the love of your dog's life or your money back.</p>
      </div>
    </div>
  </div>
</section>

即使功能部分的 z 索引为 1 且图像已消失，图像也不会堆叠在功能部分后面 none。并且两者都被赋予了相对的位置，但它仍然没有被排在后面。帮忙把它放在功能部分后面

Answer 1

       .bo {
      transform: rotate(25deg);
      height: 600px;
      position: relative;
      padding-top: 80px;
      top: 100px;
background-color:green;
      #features {
        margin: 50px;
        text-align: center;
        position: relative;
        z-index: 1;
background-color:red;

添加 bg 颜色后实际上它被堆叠在功能部分后面但是由于边距看不到使用杀虫剂查看它并去除边距然后问题将得到解决

图像没有堆叠在功能部分后面？

image not stacking behind the features section?

css

z-index