Html 将img标签转换为显示图标

我有一个第三方产品，它通过

标签输出一个图标，并通过css设置背景图像

我可能会编写一些javascript来将html标记本身更改为不同的内容，但我更愿意使用

：before

和

content=“{FontAwesomeText}”

更改css以显示一个FontAwesome图标

然而，我不能让它工作…有人知道这是否可能做到这一点吗

请看

.x-tree-icon-leaf:before {
    content: "";
    font-size: 0.6em;
    position: relative;
    top: -3px;
}

.x-tree-icon-leaf {
  font-family: FontAwesome;
  width: 20px;
  height: 20px;
  display: inline-block;
  color: #5fa2dd;
}

您的JSFIDLE未正确导入库

您不能只是复制粘贴字符并将其放置在

内容中，您需要该特定图标的正确unicode值，即：
\f06c

img

不能有伪元素，请使用分类同级或父级图标，并使用

display:none

隐藏图像

工作代码：

.x-tree-icon-leaf、.x-tree-icon-text:：before{
字体：普通14px/1“FontAwesome”；
显示：内联块；
颜色：#5fa2dd；
}
.x-tree-icon-leaf:：before、.x-tree-icon-text:：before{
内容：“\f06c\00a0”；
字号：1em；
位置：相对位置；
顶部：-1px；
}
img.x-tree-icon-leaf{display:none；}

你好
您好

Hi…当我将FontAwesome设置为外部引用时，它正在工作。如果情况不再如此，请道歉。然而，问题不是第一个跨度（因为我有这项工作），而是我试图显示内容的OP中写的标签：）还必须道歉，有人在我的OP上提出了新的工作，一些重要的文本被删除了。。。。这就是为什么不清楚我要纠正的是“img”标签。我想我已经更新了帖子。。。Thanks@GlenHong您想用您的图标替换

img

img

是一个自动关闭标记，不能有伪元素。。是否存在该图像的已分类同级或父级，可以在使用

display:none隐藏图像时对其进行操作？是，请查看更新的小提琴。。。。实际上，图像旁边有一个跨度，上面有一个类名。。。。谢谢你，你的建议已经奏效了…如果你发布一个新的简单答案，说明只是为了隐藏img背景，并将css放在兄弟姐妹身上，以显示令人敬畏的逻辑，我会批准的！谢谢