Grow your CSS skills. Land your dream job.

Opacity

  • # February 13, 2013 at 8:58 pm

    I am reading about opacity and they give this example:

    background: rgb(255, 255, 255); background: rgba(255, 255, 255, 0.6);

    What is the point in having the background color repeated twice, with one with opacity? If I take out background: rgb(255, 255, 255); nothing changes.

    Thanks in advance for your help.

    # February 13, 2013 at 9:03 pm

    @jansentina You are right. There is no point in repeating it. You can use the rgba(255, 255, 255, 0.6); alone or you can use the following:

    `rgb(255, 255, 255);
    opacity: 0.6;`

    Here’s a quick pen: http://codepen.io/srig99/pen/qdIgo.

    Note that `opacity`changes the text’s opacity that is inside in the `div` too!

    # February 13, 2013 at 10:07 pm

    It’s used as a fallback for browsers that don’t support rgba.

    Normally it would look something like this:

    background: white; /* < IE9 */
    background: rgba(255,255,255,0.6);

    # February 13, 2013 at 11:53 pm

    Thanks so much everyone!

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".