html - CSS: if is used opacity on DIV, everything inside is lighter -


i have structure this:

<div class="abc">   <ul>     <li>something</li>     ...   </ul> </div> 

i need apply on abc div opacity option. if it, works, text inside <ul> has opacity abc div => text in <ul> lighter.

is there way apply opacity on div (its background), not on content inside div?

thank you

without pulling ul out of div, way can think of make background color partially transparent using rgba if solid color:

background-color:rgba(0,0,0,.5); 

this make background black 50% opacity, work in newer browsers.

jsfiddle: http://jsfiddle.net/jdwire/xzege/

to support older browsers, instead base64 encode tiny png css (or reference external image). see http://en.wikipedia.org/wiki/data_uri_scheme more info , see https://stackoverflow.com/a/5258101/1721527 drawbacks of embedding base64 encoded image in css or html.

if background image, make partially transparent png.


Comments

Popular posts from this blog

how to insert data php javascript mysql with multiple array session 2 -

multithreading - Exception in Application constructor -

windows - CertCreateCertificateContext returns CRYPT_E_ASN1_BADTAG / 8009310b -