css - 背景颜色的不透明度，但不是文本[重复](Opacity of background-color, but not the text [duplicate])

Question

This question already has an answer here:

(这个问题在这里已有答案：)

• How do I give text or an image a transparent background using CSS?

  (如何使用CSS为文本或图像提供透明背景？)

  28 answers

  (28个答案)

How do I make the cross-browser (including Internet Explorer 6) transparency for the background of a div while the text remains opaque?

(如何在文本保持不透明的情况下为div的背景制作跨浏览器（包括Internet Explorer 6）透明度？)

I need to do it without using any library such as jQuery, etc. (But if you know of a library that does it I'd love to know so I can look at their code).

(我需要在不使用任何库（如jQuery等）的情况下完成它。（但是如果你知道一个库那样做我很想知道，所以我可以查看他们的代码）。)

  ask by Nir translate from so

Answer 1

Use rgba!

(使用rgba！)

.alpha60 {
    /* Fallback for web browsers that don't support RGBa */
    background-color: rgb(0, 0, 0);
    /* RGBa with 0.6 opacity */
    background-color: rgba(0, 0, 0, 0.6);
    /* For IE 5.5 - 7*/
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000);
    /* For IE 8*/
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";
}

In addition to this, you have to declare background: transparent for IE web browsers, preferably served via conditional comments or similar!

(除此之外，您必须为IE Web浏览器声明background: transparent ，最好通过条件注释或类似方式提供！)

via http://robertnyman.com/2010/01/11/css-background-transparency-without-affecting-child-elements-through-rgba-and-filters/

(通过http://robertnyman.com/2010/01/11/css-background-transparency-without-affecting-child-elements-through-rgba-and-filters/)