css - CSS 内容属性中的 SVG Sprite

Question

我有一个给定的 svg-sprite:

<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
   <symbol id="envelope" viewBox="0 0 512 512">
      <path d="M502.3 190.8c3.9-3.1 ...."></path>
   </symbol>
   <symbol xmlns="http://www.w3.org/2000/svg" viewBox="0 0 50 50" id="menu-2">
     <path d="M0 3h50v2H0zm0 14h50v2H0zm0 14h50v2H0zm0 14h50v2H0z"></path>
   </symbol>
</svg>

现在我想将第二个符号 (menu-2) 添加到 mydiv 的“:after”

mydiv:after {
   content: url("somehow add menu-2 from svg sprite");
}

如何引用它？

Answer 1

mydiv:after {
   content: url(http://server/sprite.svg#menu-2);
}

哪里-

http://server 服务器或存储 svg 文件的文件夹的路径
#menu-2 - Sprite 的调用部分