CSS:IE:样式版本“background-color:rgba(...)”

时间:2010-09-09 04:49:13

标签: css internet-explorer background opacity

我需要一个带有背景图像的div,并且该图像应该是一个0.7不透明度的黑色图层。

为此,我正在使用:

background-color:rgba(0, 0, 0, 0.7);
background-image:url(/Images/hash-000000-pattern.gif);

除IE之外的所有内容都能完美运行。在IE 6,7和8中,background-color:rgba(0, 0, 0, 0.7);未呈现。

我可以在CSS中做些什么而不改变标记,在背景图像上创建一个暗淡不透明的黑色图层吗?一些“过滤”风格?

2 个答案:

答案 0 :(得分:4)

没有。您拥有的唯一选项是ms-filters或略有不同。

<!--[if IE]>

   <style type="text/css">

   .color-block {
       background:transparent;
       filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000050,endColorstr=#99000050);
       zoom: 1;
    } 

    </style>

<![endif]-->

也可以看到这个:http://www.hedgerwow.com/360/dhtml/rgba/demo.html

答案 1 :(得分:2)

我有一个类似的问题,并且过来它我曾经在我的模态div上用于背景不透明等等。另一个只是为了显示微调器。这条路线似乎适用于我测试的所有当前浏览器。

.modal {
    display: none;
    position: fixed;
    z-index: 1000;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;    
    background: rgba(255,255,255, .8);
    background-color: #fff;
    opacity: 0.8;
    filter: alpha(opacity=80);
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
}
.spinner{
    z-index: 1010;
    background-image: url(/_Layouts/Images/GEARS_AN.GIF);
    background-position: 50% 50%;
    background-repeat: no-repeat;    
}