Zick zack喜欢动态边框

Question

我很想用CSS和最小的JS来重现动态Zig Zack，例如边框。

我知道有解决办法可以设置zick扎克边框，但我还没有找到一种动态的方法，它们不会自我重复

Answer 1

对于所有波浪形状，它都是相同的svg：https://www.jubla.ch/typo3temp/vhs-assets-css-946840a120b8d3aec07269053d0383d4.svg

实际上确实会重复，但是svg在每个按钮上的裁剪方式有所不同。

svg中的形状实际上具有尖角。

Screenshot - SVG with wavy shape, but sharp corners

圆角来自简单的矩形，其下面有圆角。

Screenshot - simple rectangles with rounded corners underneath

svg被这样屏蔽：

select

（纹理来自png）