在IE9中使用滤镜在背景图像上实现渐变叠加

Question

我目前正在尝试在从网址加载的背景图片上创建渐变叠加层。我使用

在大多数主流浏览器中都能使用它

background: linear-gradient(rgba(54, 91, 162, 0.66), rgba(78, 150, 231, 0.66)), url(<urlHere>);

现在我知道IE9不支持CSS Gradient，但它确实支持Filter属性，它允许Image Loading和Gradients。现在根据this StackOverflow帖子以及Microsoft Developer Network，您可以使用space分隔多个过滤器。所以我试着让我的IE9过滤器像这样

filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#a8365ba2', EndColorStr='#a84e96e7') progid:DXImageTransform.Microsoft.AlphaImageLoader(src='<urlHere>');

然而，我似乎无法在IE9中正常工作，它总是只显示没有任何渐变的背景图像，即使我在过滤器中颠倒它们的顺序。

我已经自己测试了渐变滤镜，我知道它有效，我还自己测试了背景图像滤镜，并且可以确认它也有效。

我做错了什么？

Answer 1

您可以使用background-image: url()和:before/:after进行渐变。