Html 在伪元素之前使用CSS中的羽毛图标

我在我的项目中使用羽毛图标，我需要在before伪元素中使用羽毛图标精灵的符号。我尝试将图标用作CSS中的

背景图像。我在网上读到，SVG文件中的视图标记可以通过使用
url（“path/to/file.SVG#viewname”）
访问。除了访问SVG文件中的符号外，是否可以使用类似的方法

我尝试的是：

p:：before{
内容：“；
背景图片：url（“feather sprite.svg#search”）；
显示：块；
高度：100px；
宽度：100px；
}

羽毛图标精灵示例：


...
不要使用符号。使用嵌套的svg元素、片段或组。请阅读有关Hi Ekko的信息，欢迎来到SO！7月初，我回答了如何在文档SVG中使用
和
的问题。演示中有很多内容，所以首先运行代码段（完整页面视图），进行一些悬停和调整大小，然后检查代码。这可能对你有用。。。。SVG内容在最后2个
中。SVG位于
的底部。如果您对W3C标准自定义元素API（又名Web组件）还感兴趣。。。我在5000多个图标的自定义元素中包括了281个羽毛图标：