伪元素上的字体真棒5 [英] Font awesome 5 on pseudo elements

问题描述

在4号字体中，您可以使用CSS轻松地将图标应用于:before/:after元素.

In font awesome 4 you could easily apply an icon to a :before/:after element using CSS.

使用5种出色的JS/SVG新字体实现同样的可能吗?从我可以看到的角度来看，这需要相关的标记存在于html中，这并不总是实用的，例如您拥有CMS，并希望将图标应用于所有用户创建的内容<li>元素

Is the same possible with the new font awesome 5 JS/SVG implementation? As from what i can see this requires the relevant tag to exist in html which isn't always practical e.g. you have a CMS and want to apply an icon to all user created content <li> elements

我知道在FA5中您仍然可以使用旧的css/webfonts，但是如果在推荐的JS使用方法中可以使用相同的功能，那就太好了

I know in FA5 you can still use the old css/webfonts but it would be nice if the same functionality was available in the recommended method of using JS

推荐答案

您需要启用它(默认情况下处于禁用状态).

You need to enable it (it's disabled by default).

<script>
  window.FontAwesomeConfig = {
    searchPseudoElements: true
  }
</script>

Css:

.class:before{
  display: none;
  content: "\f16c";
  font-family: "Font Awesome 5 Brands";
}

其他类型: 真棒5 +实心或常规或浅色或品牌

Other types: Font Awesome 5 + Solid or Regular or Light or Brands

这篇关于伪元素上的字体真棒5的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！