mask
mask 属性是一个表示属性，主要用于将指定的 <mask> 元素与属性所属的元素绑定。
注意： 作为表示属性，mask 也有一个对应的 CSS 属性：mask。当同时指定两者时，CSS 属性具有优先权。
你可以将此属性与以下 SVG 元素一起使用
示例
html
<svg viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg">
<mask id="myMask" maskContentUnits="objectBoundingBox">
<rect fill="white" x="0" y="0" width="100%" height="100%" />
<polygon
fill="black"
points="0.5,0.2 0.68,0.74 0.21,0.41 0.79,0.41 0.32,0.74" />
</mask>
<!--
Punch a hole in a shape of a star inside the red circle,
revealing the yellow circle underneath
-->
<circle cx="50" cy="50" r="20" fill="yellow" />
<circle cx="50" cy="50" r="45" fill="red" mask="url(#myMask)" />
</svg>
自 SVG2 起，mask 属性被定义为 CSS 属性，并且是许多其他属性的简写：mask-image、mask-mode、mask-repeat、mask-position、mask-clip、mask-origin、mask-size 和 mask-composite。
用法说明
| 值 | 请参阅 CSS 属性 mask |
|---|---|
| 默认值 | none |
| 可动画的 | 是 |
规范
| 规范 |
|---|
| CSS 蒙版模块 Level 1 # the-mask |
浏览器兼容性
加载中…
另见
- CSS
mask属性