在CSS中使用真棒字体图标

大佬教程收集整理的这篇文章主要介绍了在CSS中使用真棒字体图标，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

如何解决在CSS中使用真棒字体图标？

您不能将文本用作背景图像，但是可以使用:before或:after伪类将文本字符放置在所需的位置，而不必添加各种杂乱的额外标记。

确保position:relative在您的实际文本包装器上进行设置，以便定位。

.mytextwithicon {
    position:relative;
}    
.mytextwithicon:before {
    content: "\25AE";  /* this is your text. You can also use UTF-8 character codes as I do here */
    Font-family: FontAwesome;
    @R_301_6823@:-5px;
    position:absolute;
    top:0;
 }

Font Awesome v5使用的字体名称不是旧版本：

• 对于免费版FontAwesome v5，请使用： Font-family: "Font Awesome 5 Free"
• 对于FontAwesome v5专业版，请使用： Font-family: "Font Awesome 5 Pro"

请注意，您也应该设置相同的 属性（似乎是900）。

查找字体名称的另一种方法是右键单击页面上的示例字体超赞图标并获取字体名称（可以找到utf-8图标代码，但请注意，您可以在上找到它:before）。

解决方法

#content h2 {
   background: url(../images/tContent.jpg) no-repeat 0 6px;
}

大佬总结

以上是大佬教程为你收集整理的在CSS中使用真棒字体图标全部内容，希望文章能够帮你解决在CSS中使用真棒字体图标所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。