[CSS] Wydziedziczenie z przezroczystości Opcje

[sadistic_son]

Cześć.

Mój główny pojemnik div ma przezroczystość na poziomie 90% (albo raczej ma być przezroczysty w 10%). Wszystko co jest w nim oczywiście też jest przezroczyste. I jest ok, oprócz tego, że pewne obrazki znajdujące się wewnątrz nie mają być przezroczyste. I nie mogę się pozbyć tej przezroczystości.
Uproszczony kod:

[HTML] pobierz, plaintext 
<div class="main_container">
 <div class="next_container">
  <a href="sialala">bla bla</a>
 <div>
 
 
 <div class="next_container">
  <img class="obrazek_nieprzeroczysty" />
 <div>
 
</div>
[HTML] pobierz, plaintext 

[CSS] pobierz, plaintext 
.main_container {
 opacity:90%;
}
 
.obrazek_nieprzeroczysty{
 opacity:100%;
}
[CSS] pobierz, plaintext 

Jak widać - chcę aby element o klasie obrazek_nieprzeroczysty nie był przezroczysty.
Rozumiem zasadę dziedziczenia - wiem, że 100% dla tego obrazka to tak na prawdę 90% przezroczystości względem html. Żeby był zupełnie nieprzezroczysty musiałbym mu ustawić opacity na ponad 100%.

Jakieś pomysły? Wolałbym nie ingerować w html w takim sensie aby obrazki musieć wywalić z elementów nadrzędnych, od których przezroczystość dziedziczy.
Dzięki.

[Salvation]

opacity działa w głąb elementów i nic tego nie zmieni... I przyjmuje wartości 0 - 100 procent.
Może zamiast opacity użyjesz rgba? Wtedy nie masz dziedziczonej przeźroczystości dla dzieci tego danego elementu.

Natomiast jeżeli potrzebujesz te opacity z jakiegoś powodu, to wystarczy wrzucić 2x obrazek - wtedy jak oba się nałożą na siebie, to problem o którym piszesz zniknie. Nie jest to jednak dobra praktyka.

Ten post edytował Salvation 18.07.2022, 16:22:53