css - IE9中伪元素上的CSS渐变

Question

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

这是我的方法：

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

score 3 · Accepted Answer

使用图像。IE9 不支持 css 渐变（-ms- 前缀仅适用于 IE10），并且 dx 过滤器（您在示例代码中使用）对性能非常不利（并且有问题）。

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

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

score 1 · Accepted Answer

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

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

CSS阴影

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

2 回答 2