IE9中的伪元素上的CSS渐变

Question

知道有人在IE9中为伪元素设置CSS渐变的解决方案吗？

这是我的方法：

http://jsbin.com/iquhut/edit#html,live

似乎过滤器不适用于伪元素或者我错过了什么？

Answer 1

使用图片。 IE9不支持css渐变（-ms-前缀仅适用于IE10），dx过滤器（你在exapmle代码中使用）对性能（和错误）非常不利。

或者，您可以使用画布渲染渐变，然后将该渐变设置为元素的data-url背景。

或者，您可以使用SVG渐变背景，但是您需要将它们隐藏在其他浏览器中（好的，我们仍然在ie9中有条件注释）。请记住，它们也是buggy。但不像过滤器那样错误。

Answer 2

通过设置负扩展半径，可以通过简单的盒阴影实现几乎相同的效果。

inset? && [ <offset-x> <offset-y> <blur-radius>? <spread-radius>? <color>? ]

示例：（http://jsbin.com/ekehoz/edit#html,live）

box-shadow: 0px -15px 30px -10px #888;