我目前对在CSS伪元素中使用图标感到困惑。有4种字体家庭为fontawesome： ，Font Awesome 5 Free，，Font Awesome 5 SolidFont Awesome 5 BrandsFont Awesome 5 Regular
这是HTML：
<h1>Hello</h1>
情况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;
}
有用！
情况二
我使用以下图标：https : //fontawesome.com/icons/phone?style=solid
如您所见，它是一个solid图标，所以font-family：Font Awesome 5 Solid
h1:before {
display: inline-block;
font-style: normal;
font-variant: normal;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
content: "\f095"; /* PHONE ICON */
font-family: "Font Awesome 5 Solid";
font-weight: 900;
}
不工作！
我做错了什么？
我们如何知道何时使用正确的字体系列？