使SVG图像忽略父视图框
我在svg和viewBox中有图像,是否可以使图像忽略viewBox引起的缩放,并始终保持图像大小为50x50使SVG图像忽略父视图框,svg,viewbox,Svg,Viewbox,我在svg和viewBox中有图像,是否可以使图像忽略viewBox引起的缩放,并始终保持图像大小为50x50 <svg xmlns="http://www.w3.org/2000/svg" width="500" height="500" viewBox="0 0 200 200" preserveAspectRatio="xMidYMid meet"> <image xlink:href="someimage.png" width="50" height="50"&
<svg xmlns="http://www.w3.org/2000/svg" width="500" height="500" viewBox="0 0 200 200" preserveAspectRatio="xMidYMid meet">
<image xlink:href="someimage.png" width="50" height="50"></image>
</svg>
这里是fiddle:嵌套的svg元素怎么样
<svg xmlns="http://www.w3.org/2000/svg" width="500" height="500">
<image xlink:href="someimage.png" width="50" height="50"></image>
<svg width="100%" height="100%" viewBox="0 0 200 200" preserveAspectRatio="xMidYMid meet">
<!--other elements-->
</svg>
</svg>
您可以通过svg元素的css背景图像属性显示图像,而不是使用图像元素。
此图像不受svg元素的viewBox的影响
svg{
background-image:url("***.jpg");
background-repeat:no-repeat;
background-size:50px 50px;
}
只需删除viewBox属性。如果不止这些,你应该解释它是什么。有很多其他元素应该在viewBox下创建一个带有viewBox的内部svg元素,并将其他元素放在该元素下,或者如果svg嵌入html中,则将其移动到另一个svg元素。svg的结构不能更改