Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to set opacity to the background color of a div? [duplicate]

I have this class

.box { background-color:#fff; border:3px solid #eee; } 

My question is how can I set an opacity to the white background only so that it will kinda mix with my background?

Thank you.

like image 498
EnexoOnoma Avatar asked Jul 08 '11 12:07

EnexoOnoma


People also ask

How do I set a Div background opacity?

To set the opacity of a background, image, text, or other element, you can use the CSS opacity property. Values for this property range from 0 to 1. If you set the property to 0, the styled element will be completely transparent (ie. invisible).

How do you add background color with opacity?

Changing the opacity of the background color only To achieve this, use a color value which has an alpha channel—such as rgba. As with opacity , a value of 1 for the alpha channel value makes the color fully opaque. Therefore background-color: rgba(0,0,0,. 5); will set the background color to 50% opacity.

Can I set an opacity only to the background image of a div?

There's no CSS property that you can use to change the opacity of only the background image. Unlike background colors, which allow you to adjust the alpha channel to control opacity, it simply doesn't exist for the background-image property.


1 Answers

I think rgba is the quickest and easiest!

background: rgba(225, 225, 225, .8)

like image 178
Kevin Brown Avatar answered Sep 23 '22 03:09

Kevin Brown