CSS3 Property ondeursigtigheid

Question

Hoe kan ek 'n impak net die dekking van 'n ouer element en nie sy kinders

bv

Ek wil signup_backdrop ondeursigtigheid te stel op 0,5, maar dit is kind element signup_box i wil nie enige dekking te hê, maar dit sal die stel in signup_backdrop ondeursigtigheid van toepassing as geërf.

Answer 1

Jy kan nie. Jy moet die kinders super-lê (posisionering, en z-indeks) oor die ouer, wat beteken dat hulle sal nie meer kinders wees. Dat, of gebruik deursigtige PNG se vir die ouer agtergrond, en stel ondeursigtigheid vir enige broers en susters van die ten volle-ondeursigtig kind.

* ongetoets, maar moet goed wees.

.signup_backdrop {
  position:fixed;
  top:0; left:0;
  background:#333333;
  width:100%; height:100%;
  z-index:10;
}
    
.signup_box {
  position:fixed;
  top:25%; left:25%;
  background:#ffffff;
  width:50%; height:50%;
  z-index:20;
}

<div class="signup_box">
   <p>Hello World</p>
</div>
<div class="signup_backdrop"></div>

Answer 2

In CSS 3 het jy rbga () om 'n kleur en dekking toe te voeg tot 'n sekere element.
Dit is tot dusver geïmplementeer in Safari 3 en Firefox 3 net.
Vir ander blaaiers gebruik die truuks uit antwoord Jonathan Sampson se.