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