SVG用透明度覆盖

【问题标题】：SVG overwrite with transparencySVG用透明度覆盖
【发布时间】：2012-04-07 20:21:17
【问题描述】：

我有这个 svg：

<circle cx="50" cy="100" r="50"  stroke-width="0" fill="orange"/>
<polygon points="0,100, 50,50 100,100" fill="white"/>

背景是透明的。多边形用白色覆盖了圆圈，但我希望这个区域是透明的（而不是白色）。我该怎么做？

【问题讨论】：

标签： svg transparency

【解决方案1】：

您可以将fill-rule: evenodd 属性与path:s 结合使用，为您的形状“挖洞”：

<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
<path fill="orange"
      fill-rule="evenodd"
      d="M50 50 L100 100 L0 100
         A50 50 0 0 1 100 100
         A50 50 0 0 1 0 100 z"/>
</svg>

【讨论】：

另见：stackoverflow.com/questions/1983256/…