剪裁和掩蔽

CSS Clipping 和 Masking 是非常新的概念，因此浏览器对这些属性的支持非常低。

面具：

截至撰写本文时（2016 年 7 月），Chrome，Safari 和 Opera 使用 -webkit- 前缀支持这些属性。

Firefox 不需要前缀，但只有在与 SVG mask 元素一起使用时才支持掩码。对于内联 SVG mask 元素，语法为 mask: url(#msk)，而对于在外部 SVG 文件中使用 mask 元素，语法为 mask: url('yourfilepath/yourfilename.svg#msk')。两种情况下的 #msk 都是指被引用的 mask 元素的 id。如本回答所示 ，目前 Firefox 在 mask 属性中不支持 mask-reference 以外的任何参数。

Internet Explorer（和 Edge）目前尚未对此属性提供任何支持。

任何带或不带前缀的浏览器目前都不支持 mask-mode 属性。

夹路径：

截至撰写时（2016 年 7 月），当使用基本形状（如 circle，polygon）或带有内联 SVG 的 url(#clipper) 语法创建路径时，Chrome，Safari 和 Opera 支持 clip-path。它们不支持基于外部 SVG 文件一部分的形状进行裁剪。此外，它们还需要 -webkit 前缀。

Firefox 仅支持 clip-path 的 url() 语法，而 Internet Explorer（和 Edge）不提供支持。