Html 调整svg形状大小时保持svg模式缩放

我将svg模式应用于多边形。很好用。 当我在svg多边形上设置另一个大小时，我不想缩放图案

我尝试了所有我能想到的viewBox、patternUnits和patternContentUnits的组合。目标是使多边形负责任地工作，例如，使用其父元素进行缩放。谁能给我指出正确的方向吗

---

您始终可以适当缩放图案并调整多边形的大小，例如：

<polygon transform="scale(2)" points="0,0 720,0 720,10 0,30" stroke="#bbb" fill="url(#pattern)" />

---

我通过将图案应用于

，然后使用css

剪辑路径创建多边形，暂时解决了此问题，并且图案不会缩放。我仍然更愿意使用纯svg来解决这个问题，因为IE不支持css
clip path


.clip{
背景：灰色；
剪辑路径：多边形（0,100%0,100%30,0%100%）；
边缘底部：1米；
}
.clip.half{
宽度：50%；
}
svg{
显示：块；
高度：50px；
宽度：100%
}

是的，这是可行的，但是我希望多边形能够在响应性强的实现中工作，因此更“通用”的方法更合适。编辑我的问题以说明这一点。你必须在调整大小时动态反向缩放图案。