Question

我在这里遇到了一些问题。我试图设置<div id='coupons'>的背景颜色但是当我这样做时，什么也没发生！请帮我解决这个问题。我留下了大部分的CSS，因为我没有任何冲突的背景颜色标签。

＆＃13;

#coupons {
  background-color: black;
}

＆＃13;

<div id='coupons'>
  <a id="coupons" name='coupons'>
    <div style="float:left">
      <img id='myImg' src="https://preview.ibb.co/jBYUxv/coupon1.png" id="i1" height="300px" width="600px">
      <div id="myModal" class="modal">
        <span class="close">×
    		  </span>
        <img class="modal-content" id="img01">
        <div id="caption">
        </div>
        <script>
          // Get the modal
          var modal = document.getElementById('myModal');
          // Get the image and insert it inside the modal - use its "alt" text as a caption
          var img = document.getElementById('myImg');
          var modalImg = document.getElementById("img01");
          img.onclick = function() {
            modal.style.display = "block";
            modalImg.src = this.src;
          }
          // Get the <span> element that closes the modal
          var span = document.getElementsByClassName("close")[0];
          // When the user clicks on <span> (x), close the modal
          span.onclick = function() {
            modal.style.display = "none";
          }
        </script>
      </div>
    </div>
    <div id='pformat'>
      <p>COUPONS FOR YOU!
      </p>
    </div>
  </a>
</div>

＆＃13;

Answer 1

你在#coupon里面的div是浮动的，这意味着#coupons colappses ...意思是它没有高度因此没有backgroudn。试试这个... #coupons：after {content：“”;显示：表;明确：两者;清除漂浮的孩子。

Answer 2

看来你的.png不透明。图像本身具有白色背景。

id＃coupons不止一次使用，也许这会产生不必要的结果。

Answer 3

正如@Barmar所说，我可以看到图像背后的黑色，所以我假设您正在寻找jQuery解决方案。

[此外，@ Joe B.对你的透明度提出了有效的观点]

如果您尝试使用jQuery更改背景颜色，可以使用.css()：

＆＃13;

$('#coupons').css(`background-color`, 'pink');

＆＃13;

#coupons {
  background-color: black;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="coupons">I am a coupons</div>

＆＃13;

在div中设置背景颜色不起作用

3 个答案: