如何在css中使用svg剪裁div？

如何使用svg剪裁div

以下是css动画的代码：

。液体{
位置：绝对位置；
顶部：-80px；
左：0；
宽度：200px；
高度：200px；
背景#4973ff；
长方体阴影：嵌入0.50px rgba（0,0,0,0.5）；
过渡：0.5s；
}
.液体：：之后，
.液体：：之前{
内容：“；
宽度：200%；
身高：200%；
位置：绝对位置；
排名：0；
左：50%；
转换：翻译（-50%，-75%）；
背景：#000；
}
.液体：：之前{
边界半径：45%；
背景：rgba（20,20,20,1）；
动画：动画5s线性无限；
}
液体之后{
边界半径：40%；
背景：rgba（20,20,20,0.5）；
动画：动画10秒线性无限；
}
@关键帧设置动画{
0% {
变换：平移（-50%，-75%）旋转（0度）；
}
100% {
变换：平移（-50%，-75%）旋转（360度）；
}
}

---

如果我理解正确，可能是这样

.element {
     clip-path: url(#svgClipPathID);
}

这是一篇关于剪辑路径的非常好的文章：

---

.

可以使用svg defs尝试剪辑路径或掩码。它应该可以工作。尝试添加

溢出：隐藏至
液体
类别号。不是那样的。我想在svg图像中剪辑.liquid类。svg图像将包含.liquid类动画。我希望您能理解我。有人能提出一些建议吗？拜托，我试过了。但我使用的是svg图像元素。未按预期工作。请理解，我没有使用路径进行剪辑。而是使用svg图像。好的，对不起，我的错误