[英]CSS background SVG not displayed
I have this off.svg
icon which I want to insert through css: 我有这个要通过CSS插入的off.svg
图标:
<svg height="16" width="16" >
<circle cx="8" cy="8" r="7" fill="red" />
</svg>
The css: CSS:
.off-btn {
background:url(../icons/off.svg)no-repeat;
}
html: 的HTML:
<span class="off-btn" title="offline">offline</span>
But the svg icon does not shows up. 但是不会显示svg图标。
However when I saved off.svg
as off.png
and changed the css to: 但是,当我将off.svg
保存为off.png
并将css更改为:
.off-btn {
background:url(../icons/off.png)no-repeat;
}
The circle shows up. 圆圈出现。 I test this on Chrome browser. 我在Chrome浏览器上对此进行了测试。
What is wrong here? 怎么了 How can I fix it? 我该如何解决?
you're missing the SVG namespace in the SVG file. 您在SVG文件中缺少SVG名称空间。 If you try to load it in a browser it will tell you that. 如果您尝试将其加载到浏览器中,它将告诉您。
<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16" >
<circle cx="8" cy="8" r="7" fill="red" />
</svg>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.