多层<svg>多边形 - 不工作

Question

如何在同一个 SVG 中添加多层 SVG 多边形？ 例如，我在这里有一张汽车的图（参见片段），如果我想在上面添加一个窗口怎么办？ 如果我在汽车标记下方写新的窗口标记（见代码段），它是不可见的。 如果我把它写在上面，汽车标记就会被覆盖。

 <svg heght="100" width="100"> <!--bil--> <polygon points="0,100 0,70 5,65 20,65 30,40 70,40 80,65 95,65 100,70 100,100 90,100 80,90 70,100 30,100 20,90 10,100" style="fill:#777; stroke:#444; stroke-width:3px;"> <!--window--> <polygon points="30,30 50,30 50,50 30,50" style="fill:blue; stroke:#444; stroke-width:3px;"> </svg>

Answer 1

在 SVG 中，您必须使用 /> 或结束标记（例如</polygon>正确终止元素

html 解析器将您当前的标记解析为不允许的嵌套多边形。

您的窗口不在正确的位置，但至少现在它是可见的。

 <svg heght="100" width="100"> <!--bil--> <polygon points="0,100 0,70 5,65 20,65 30,40 70,40 80,65 95,65 100,70 100,100 90,100 80,90 70,100 30,100 20,90 10,100" style="fill:#777; stroke:#444; stroke-width:3px;"/> <!--window--> <polygon points="30,30 50,30 50,50 30,50" style="fill:blue; stroke:#444; stroke-width:3px;"/> </svg>