我正在尝试按照本教程向我的HTML div元素添加SVG掩码：
https://developer.mozilla.org/en-US/docs/Web/SVG/Applying_SVG_effects_to_HTML_content
以下是相关代码：
<!DOCTYPE HTML>
<html>
<body>
<svg height="0">
<mask id="mask_1">
<linearGradient id="grad_1" x1="0" x2="0" y1="0" y2="1">
<stop offset="0.0" stop-color="white" stop-opacity="0.0" />
<stop offset="1.0" stop-color="white" stop-opacity="1.0" />
</linearGradient>
<rect x="0" y="0" width="72" height="72" fill="url(#grad_1)"/>
</mask>
</svg>
<div style="left:0px;top:0px;width:68px;height:68px;background-color:#ff0000;background-size:auto;mask:url(#mask_1);">Here's some text.</div>
</body>
</html>
但是面具不起作用。正确渲染div元素，减去应该使它们向顶部渐弱的掩模。我错过了一些明显的东西吗此方法仅适用于XHTML与HTML 5吗？感谢。