如何在html <polygon>或<path>？</path> </polygon>之外填充

Question

我可以在html＆lt; polygon＆gt;之外填写吗？或者＆lt; path＆gt;如下图所示？

<div style="background:'image.png'>
  <svg style="background:rgb(100,100,230)">
    <polygon points="x,y x1,y1 ..."
      style="fill:???;fill-rule:???"/>
  </svg>
</div>

我绝对可以填写<polygon>或<path>。但我怎么能在他们之外填补？我知道一个使用外部多边形封闭星体外部的解决方法。有一个简单的方法吗？

Answer 1

我还没有找到填充多边形外部的方法。但你可以产生同样的效果，虽然它有点混乱，就像这样。

从画布外的某处开始。创建一条从那里到多边形周边近点的路径，沿着你的多边形循环 - 让我们说我们顺时针方向 - 一直回到你加入它的地方，顺时针方向到外面一点你的画布，然后围绕你的画布外围，逆时针，在一个大矩形中，回到你刚开始的地方。

Answer 2

你不能在外面“填充”形状。但是你可以把它放在后面。

在你的例子中，你会有一个蓝色正方形，然后在它前面放一个星形的剪裁图像。