小编Mar*_*gir的帖子

FontAwesome - 在CSS伪元素中选择正确的font-family

我正在使用font-awesome版本"Font Awesome Free 5.0.6".我目前很困惑使用CSS伪元素中的图标.有4种字体家庭为fontawesome: ,Font Awesome 5 Free,,Font Awesome 5 SolidFont Awesome 5 BrandsFont Awesome 5 Regular

这是HTML:

<h1>Hello</h1>

Run Code Online (Sandbox Code Playgroud)

情况1

我用这个图标:https://fontawesome.com/icons/twitter？style = brands

如你所见,它是一个brands图标,所以font-family:Font Awesome 5 Brands

h1:before {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  content: "\f099"; /* TWITTER ICON */
  font-family: "Font Awesome 5 Brands";
  font-weight: 400;
}

Run Code Online (Sandbox Code Playgroud)

有用!