为什么丢弃阴影过滤器在Internet Explorer中不起作用?

时间:2017-12-08 07:46:50

标签: html css svg cross-browser dropshadow

我在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')";

1 个答案:

答案 0 :(得分:0)

它不起作用,因为对于此过滤器,您必须使用CSS编写:

filter: url(#drop-shadow);