如何在CSS中使用SVG符号？

对于我来说， Using symbols in SVG formats似乎是个好主意，所以你只能加载一个SVG文件，并将其用作一个spritemap。

但是，直接包含< svg>< / svg>标签在我的html的图标，因为他们只是演示文稿，应该添加到我的CSS。

有没有办法从svg中添加一个符号：在我的CSS中的伪元素之后？

解决方法

您可以以CSS的方式引用片段(片段必须具有要标识的ID)：

.element {
background-image: url('vector.svg#fragment');
}

您还可以通过使用viewBox进行剪裁来显示特定区域：

.element {
background-image: url('vector.svg#fragment(viewBox(0,25,25))');
}

在这里，您可以阅读有关此方法的更多信息：
http://www.broken-links.com/2012/08/14/better-svg-sprites-with-fragment-identifiers/

另一种方法可能是以图标字体创建所有符号。

原文地址：https://www.jb51.cc/css/218185.html