irpas技术客

图标文字的下载和使用(iconfont)_surymy

网络 6865

下载——传送门解压后将文件夹中的css和webfonts这两个文件夹移到自己的项目里(且这两个文件夹最好党在同一级目录下) 引入all.css到网页中: <link rel="stylesheet" href="css/all.css"> 插入图像文字的三种方法 ① 直接通过类名来使用,其中类名fas或fab部分是固定的,后边跟的fa--bell是具体使用的图标 <span class="fas fa-bell"></span>

② 使用实体:&#x ____;

<span class="fas">&#xf0f3;</span>

③ 使用伪元素

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <link rel="stylesheet" href="css/all.css"> <title>Document</title> </head> <style> .box1{ font-size: 50px; color: blue; font-family: 'Courier New', Courier, monospace; } .box1::before{ content: "\f1b0"; font-family: 'Font Awesome 5 Free'; font-weight: 900; /* font-family: 'Font Awesome 5 Brands'; */ } </style> <body> <div class="box1"> 凯梦兽 </div> </body> </html>


1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,会注明原创字样,如未注明都非原创,如有侵权请联系删除!;3.作者投稿可能会经我们编辑修改或补充;4.本站不提供任何储存功能只提供收集或者投稿人的网盘链接。

标签: #classquotfas #使用实体ampampx #____ampltspan