html - Opacity in nested div tag -
this question has answer here:
i looking css
solution can set lower value of opacity
background color, , text on b opaque.
i tried this:
<div style="opacity: 0.4; background:none repeat scroll 0% 0% rgb(242, 242, 242); "> <div style="opacity: 1;"> complete opaque text on background color </div> </div>
but didn't work. here opacity both both background color , text getting changed per outer div opacity value.
can please suggest solution?
you can use rgba
set semi-transparent colors:
<div style="background:rgba(242, 242, 242, 0.4);"> <div> complete opaque text on background color </div> </div>
the opacity of child element never higher parent's opacity, if parent's opacity 0.4 child opacity 1 0.4, child opacity 0.5 0.2 etc.. calculated relatively parent's opacity.
for older ie versions use filter
achieve effect or regular rgb
fallback other old browsers
Comments
Post a Comment