Html 具有透明度的SVG

我的目标是创造一个像这样的效果。有一个在背景视频上透明的SVG。到目前为止，我有一个AI文档，它的路径形状是我从photoshop导出的。理想情况下，我希望路径的内部是透明的，但其他部分是白色的，就像示例中所示。我怎样才能达到这样的效果

看起来它与这行代码有关，但我肯定是误解了什么

svg > rect {
    fill: white;
    -webkit-mask: url(#mask);
    mask: url(#mask);
}

我不认为我的SVG已经准备好仅仅作为一个路径，如果我导出它，它会显示为空白，如果我在路径上放置一个笔划，除了笔划之外的任何东西都是透明的，或者它根本没有任何透明度

通常情况下，作为一名web开发人员，我的工作流程从未深入使用SVG，因此我对此有点执着。

该CSS规则中的

#mask

指的是SVG中的以下元素：

<mask id="mask" x="0" y="0" width="1920" height="1080" >
...
</mask>

...

您可以通过web上提供的教程或其中一个教程了解遮罩的工作原理