Question

Is it possible to change an element’s background RGBA’s alpha without actually changing the color?

Or setting the color without overriding the alpha?

Prefferably cross-browser and without Javascript.

I can do it obviously by specifying the rgba color but I’d like to do classes for each %10 of transparency, and be able to set any color.

Thanks 🙂

Answer 1

In your CSS stylesheet:

.trans10 {
   background-color: 33ccaa;
   opacity:0.1;
   filter:alpha(opacity=10); /* For IE8 and earlier */
}

.trans20 {
   background-color: 33ccaa;
   opacity:0.2;
   filter:alpha(opacity=20); /* For IE8 and earlier */
}

And so on…