javascript - 在 svg 中显示 fontawesome 图标

Question

如何在 svg 片段中显示字体图标？我尝试了以下但它不起作用:

<svg xmlns="http://www.w3.org/2000/svg">
<g>
  <rect x="0" y="0" width="100" height="100" fill="red" ></rect>
  <text x="30" y="30" font-family="FontAwesome" font-size="20" fill="blue" >&#xf042;</text>
</g>
</svg>

Unicode 对应于可以找到的 fa-adjust 图标 here .另外，如何从图标名称中获取 unicode？

Answer 1

你的样式表应该声明字体系列

svg text {
   font-family: FontAwesome;
   font-size:20px;
   background-color:blue;
}

HTML

<text x="30" y="30">&#xf042;</text>