为什么阴影过滤器在 Internet Explorer 中不起作用？答案

【问题标题】：Why drop shadow filter does not work in Internet Explorer?为什么阴影过滤器在 Internet Explorer 中不起作用？
【发布时间】：2019-01-27 03:51:53
【问题描述】：

我将此代码用于 IE 和其他浏览器，但它在 IE 中不起作用。

HTML 部分

<svg height="0" width="0" xmlns="http://www.w3.org/2000/svg">
    <filter id="drop-shadow">
        <feGaussianBlur in="SourceAlpha" stdDeviation="2.2"/>
        <feOffset dx="12" dy="12" result="offsetblur"/>
        <feFlood flood-color="rgba(0,0,0,0.5)"/>
        <feComposite in2="offsetblur" operator="in"/>
        <feMerge>
            <feMergeNode/>
            <feMergeNode in="SourceGraphic"/>
        </feMerge>
    </filter>
</svg>

Css 部分

-ms-filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=12, OffY=12, Color='#444')";
filter: "progid:DXImageTransform.Microsoft.Dropshadow(OffX=12, OffY=12, Color='#444')";

【问题讨论】：

请说明您使用的IE版本
Internet Explorer 11、10 和 9

标签： html css svg cross-browser dropshadow

【解决方案1】：

它不起作用，因为对于这个过滤器，你必须用 CSS 编写：

filter: url(#drop-shadow);

【讨论】：