红色bg +黑色字段，不透明度为85 =粉红色文字 [英] Red bg + black field with opacity on 85 = pink text

问题描述

 < style> 
 * {
 background：red; 
} 
 .blackbalk {
 background：black; 
 ms-filter：progid：DXImageTransform.Microsoft.Alpha（Opacity = 85）; 
 filter：alpha（opacity = 85）; 
 -khtml-opacity：.85; 
 -moz-opacity：.85; 
 opacity：.85; 
 width：985px; 
 margin：0 auto; 
 height：255px; 
 color：white; 
} 
< / style> 
< div class =blackbalk>文字< / div> 
  

现在我的文字变成粉红色了，为什么？
如何再次变成白色？

问候

编辑：JS Fiddle clear： http://jsfiddle.net/WFxbH/

$ b

$

$

$ b

现场演示 工作在每个您关心的浏览器，我的jsFiddle包括推荐IE 条件性评论，以使其也能在该浏览器中正常工作。

  .blackbalk {
 / *不支持RGBa的Web浏览器的后备* / 
 background：rgb（0， 0）; 
 / * RGBa与0.6不透明* / 
背景：rgba（0，0，0，0.85）; 
 / *对于IE 5.5  -  7 * / 
 filter：progid：DXImageTransform.Microsoft.gradient（startColorstr =＃D8000000，endColorstr =＃D8000000）; 
 / *对于IE 8 * / 
 -ms-filter：progid：DXImageTransform.Microsoft.gradient（startColorstr =＃D8000000，endColorstr =＃D8000000）; 
} 
  

<style>
* {
    background: red;
}
.blackbalk{
    background:black;
    ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
    filter:alpha(opacity=85); 
    -khtml-opacity:.85; 
    -moz-opacity:.85; 
    opacity:.85; 
    width: 985px;
    margin: 0 auto;
    height:255px;
    color: white; 
}
</style>
<div class="blackbalk">Text </div>

Now my text gets pink, why? How can i get it white again?

Greetings

Edit: JS Fiddle to make it clear: http://jsfiddle.net/WFxbH/

解决方案

You can do it by instead using an rgba background on your element:

Live Demo - this will work "in every browser you care about", and my jsFiddle includes the recommended IE conditional comment to make it also work in that browser.

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

这篇关于红色bg +黑色字段，不透明度为85 =粉红色文字的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！