html - 用于 IE 中的图像遮罩的 SVG

Question

我在这里使用 IE 10，firefox 工作正常，但 IE 中没有显示掩码

<svg style="height:0;">
                                      <mask id="m1" maskUnits="userSpaceOnUse" maskContentUnits="userSpaceOnUse">
                                        <image width="78px" height="78px" xlink:href="images/mask2.png"></image>
                                      </mask>
                                    </svg>
                                    <img src="images/avatar-sample.jpg" style="mask:url(#m1);"/>

Answer 1

目前只有 Firefox 支持将掩码直接应用于 HTML 元素。其他 UA 只允许您在 SVG 对象上设置 SVG 效果，例如蒙版。

如果你想让它在 IE 中工作，你必须使用 SVG<image>元素而不是 HTML<img>元素来显示图像。