If you do not want apply opacity, you can use this instead:
background: rgba(255, 255, 255, 0.6);
Resources:
An element's opacity can be set using the opacity
property. Values can be anywhere from 0.0
(transparent) to 1.0
(opaque).
Example Usage
<div style="opacity:0.8;">
This is a partially transparent element
</div>
Property Value | Transparency |
---|---|
opacity: 1.0; | Opaque |
opacity: 0.75; | 25% transparent (75% Opaque) |
opacity: 0.5; | 50% transparent (50% Opaque) |
opacity: 0.25; | 75% transparent (25% Opaque) |
opacity: 0.0; | Transparent |
To use opacity
in all versions of IE, the order is:
.transparent-element {
/* for IE 8 & 9 */
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; // IE8
/* works in IE 8 & 9 too, but also 5, 6, 7 */
filter: alpha(opacity=60); // IE 5-7
/* Modern Browsers */
opacity: 0.6;
}