與透明度

Question

SVG重寫我有此SVG：

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

背景是透明的。多邊形覆蓋白色圓圈，但我希望這個區域是透明的（而不是白色）。我怎樣才能做到這一點？

Answer 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>