Question

我有横幅图像有点设置，文字位于图像上方。由于大多数时候图像比文本更亮。我想在图像上方添加一些颜色并降低叠加层的不透明度。当我做这个背景颜色时，只是在背景图像下面，所以我无法在图像上看到任何叠加，仍然图像看起来更亮

＆＃13;

#banner-image {
  background-size: cover;
  background-image: url('https://dusy1lvven6c5.cloudfront.net/content/attachment/640/Dear_Women-Exercise-Your-Right-To-Invest-Blog-1024x768.jpg');
  background-color: rgba(0, 0, 0, 0.6);
}

＆＃13;

<div class="row overlay" id="banner-image">
  <div class="col-lg-12 col-md-12 col-sm-12">
    <div class="col-lg-6 col-md-6 col-sm-6 col-md-offset-6 col-sm-offset-6" id="banner-content-div">
      <p id="intro-text">What are mutual funds ?</p>
      <p id="intro-exp">Mutual funds, you've seen them on TV and magazine covers.. but what are they? And how do they work?...</p>
      <a href="mutual_fund.html" class="btn btn-default btn-readmore">Read more</a>
    </div>
  </div>
</div>

＆＃13;

背景图片和颜色无法合作

0 个答案: