Wednesday, 15 August 2012

html - CSS Background Color Transparency -



html - CSS Background Color Transparency -

this question has reply here:

how give text or image transparent background using css? 22 answers

i'm trying set transparency of <div> effect background color only, time it, ends making entire <div> transparent. here's css, , fiddle demonstrate:

html { background-image: url("https://dl.dropboxusercontent.com/u/47991825/8856597-daisies-green-background.jpg"); } .profilepic { width: 128px; height: 128px; border-radius: 64px; -webkit-border-radius: 64px; -moz-border-radius: 64px; } h1 { font-family: 'open sans', sans-serif; font-weight: bold; } #maincont { width: 250px; margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0; padding: 15px; border: 1px solid #000000; height: 40%; font-family: 'open sans', sans-serif; font-weight: normal; font-size: 12pt; background-color: #000000; opacity: 0.4; } #footer { position: absolute; bottom: 0; height: 40px; margin-top: 40px; } ul { list-style-type: none; padding: 0; } a:link { text-decoration: none; }

http://jsfiddle.net/joshrlangley/ne2o1r5x/1/

(background) colors have rgba(r, g, b, opacity) format.

#maincont { // 0, 0, 0 = black // 255, 255, 255 = white background-color: rgba(0, 0, 0, 0.4); }

http://jsfiddle.net/rudiedirkx/ne2o1r5x/2/

background images unfortunately still don't have opacity option.

html css transparency

No comments:

Post a Comment