我将SVG图像嵌入HTML页面的不同元素中时遇到了一定问题。嵌入了相同的SVG元素,如下所示:
<img src="gwidget.svg">
<object data="gwidget.svg"></object>
根元素由多个<g>
子元素组成,其中包含<circle>
和<path>
。 <path>
的类具有translate
样式的scale
和transform
属性。
当我在Chrome上使用浏览器缩放时,<object>
元素会引起问题。 path元素放错了位置,即使将浏览器缩放比例恢复为原始值也无济于事。奇怪的是,打开DevTools并打开和关闭class属性可以修复问题。
<img>
中的SVG或在Edge中做同样的事情时,不会出现以下问题,所以我想知道这是否是特定于Chrome的错误吗?还是其他可能导致问题的原因?