父母的透明背景使子图像透明

Question

我已将主背景设置为透明，我将图像放在继承不透明度 0.4 的背景之上，我不希望这样。我希望它是 100%。我什至尝试过opacity 1.0 在这里不起作用是我的代码：

HTML：

<!-- Background -->
<img src="img/bg.jpg" id="bg" alt="">

<!-- The image -->
<div class = "row">
    <div class = "logo">

      <img src="img/logo.png" width="100%" height="141" id="logo" alt="Title" /> 
      </div>
      </div>

CSS：

//Background
    #bg {
      position: fixed; 
      top: 0; 
      left: 0;
      opacity: 0.4; 

      width: 100%;
      min-height: 100%;
    }

//the image
#logo {
    opacity : 1.0;!important;
}

Answer 1

原来不透明通道是继承的

尝试改用rgba 属性：

background-color: rgba(0, 0, 0, 1); /* red, gree, blue, alpha (opacity) */

学分：答案改编自this one

#bg {
  z-index: -1000;
  position: fixed;
  top: 0;
  left: 0;
  opacity: 0.4;
  width: 100%;
  min-height: 100%;
}

.logo,
#logo {
  background-color: rgba(0, 0, 0, 1);
  padding:0;
  margin: 0;
}

<!-- Background -->
<img src="http://lorempixel.com/400/400" id="bg" alt="">

<!-- The image -->
<div class="row">
  <div class="logo">
    <img src="http://lorempixel.com/300/150" width="100%" height="150" id="logo" alt="Title" />
  </div>
</div>