CSS оверлей с DIV без наложения

Question

У меня есть панель с классом CSS для наложения, который содержит DIV, который должен быть не прозрачным

<asp:panel id="panelOverlay" runat="server" class="Overlay" visible="false"> 
     <asp:panel id="panelPopUpPanel" runat="server" class="PopUpPanel" visible="false"> 
      <asp:panel id="panelPopUpTitle" runat="server" style="width: 100%; height: 20px; text-align: right; "> 
       <asp:imagebutton id="cmdClosePopUp" runat="server" imageurl="~/pict/graphics/delete.png"></asp:imagebutton> 
      </asp:panel> 
     <div class="noOverlay"> 
      <h4>This is the PopUp Window</h4> 
      <asp:Label runat="server" ID="codice"></asp:Label> 
     </div>        
     <div>&nbsp;</div> 
     </asp:panel> 
    </asp:panel> 

У меня есть этот класс CSS

.Overlay { 
      position:fixed; 
      top:0px; 
      bottom:0px; 
      left:0px; 
      right:0px; 
      overflow:hidden; 
      padding:0; 
      margin:0; 
      background-color:#000; 
      filter:alpha(opacity=50); 
      opacity:0.5; 
      z-index:1000; 
     } 

    .noOverlay { 
     background-color:#ffffff; 
     filter:alpha(opacity=100); 
     opacity:1; 
    } 

я могу 't настроить .noOverlay css, чтобы заставить его работать Спасибо

Answer 1

.noOverlay НЕ ПРОСТОТА, но его родительский контейнер является причиной .noOverlay t o выглядят так, как если бы они были прозрачными.

Использование rgba вместо, который позволяет установить цвет фона в и прозрачность фона оставалась только для этого конкретного элемента:

body {background:green} 
 

 
.demoBox { 
 
    background: #000; 
 
    padding: 20px; 
 
} 
 
.Overlay { 
 
    /* The last argument is the transparency from 0 to 1 */ 
 
    background: rgba(0, 0, 0, .5); 
 
    color:#fff; 
 
} 
 
.noOverlay { 
 
    background: rgba(255, 255, 255, 1); 
 
    color:#000; 
 
}

<div class="demoBox Overlay"> 
 
    I am a transparent div 
 

 
    <div class="demoBox noOverlay">I am not a transparent div</div> 
 
</div>

Как вы увидите здесь, то .noOverlay содержится в пределах .Overlay div, однако, только .Overlay прозрачен.