Problème d'opacité avec css, div et asp: Image

Question

J'ai un div qui a opacity mis à 60. Dans le div, j'ai un asp: Image. Il semble que l'opacité du div définit également l'opacité de l'image. J'ai essayé de créer une classe séparée pour l'image et de définir le opacity à 100, mais cela ne semble pas fonctionner. Quelqu'un a-t-il une solution?

<div id="PleaseWait" class="Splash"> 
    <asp:Image ID="Logo" runat="server" ImageUrl="logo.png" CssClass="imgOpac" /> 

<div style="color: White; font-size: medium;"> 
    Please wait, searching spectrum listings ...</div> 
</div> 

<style id="splash" type="text/css"> 
    .Splash 
    { 
     padding-top:200px; 
     display: none; 
     text-align: center; 
     color: White; 
     vertical-align: top; 
     width: 100%; 
     height: 100%; 
     filter:alpha(opacity = 60); 
     -moz-opacity:0.6; 
     background-color:#000000; 
     position:absolute; 
     z-index:500; 
     top:0%; 
     left:0%; 
    } 
    .imgOpac 
    { 
     filter:alpha(opacity = 100); 
     -moz-opacity:1.0; 
    } 
    </style> 

Answer 1

C'est ainsi que fonctionne l'héritage CSS. Votre image obtient son paramètre d'opacité hérité de sa div parente. Donc, 100% de 60% est toujours 60%.

Voir http://www.hedgerwow.com/360/dhtml/css-opacity-inherit.html pour la solution de contournement générale (voir la source). L'astuce de base consiste à empiler les éléments, celui avec l'opacité en dessous de celui sans.

Answer 2

Essayez ceci:

.Splash .imgOpac 
{ 
    filter:alpha(opacity = 100); 
    -moz-opacity:1.0; 
} 

Cela devrait remplacer la classe de Splash.