标签 美化 下的文章

下面是本站使用的例子

 

Font Awesome 是一套绝佳的图标字体库和CSS框架。

Font Awesome 字体为您提供可缩放矢量图标,它可以被定制大小、颜色、阴影以及任何可以用CSS的样式。

要使用Font Awesome图标,请在HTML页面的 部分中添加以下行:

1、国内推荐 CDN:

<link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">

2、海外推荐 CDN

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
3、直接下载到本地
[ypbtn]https://www.lanzous.com/iayt9if[/ypbtn]
(不建议这样使用,因为慢,直接调用CDN多好吖)
示例
使用前缀 fa 和图标的名称来放置 Font Awesome 图标。

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">
</head>
<body>

<i class="fa fa-car"></i>
<i class="fa fa-car" style="font-size:48px;"></i>
<i class="fa fa-car" style="font-size:60px;color:red;"></i>

</body>
</html>

输出结果



在多数主题模板中都自带了Font Awesome库,所以试试直接在需要的地方引用
<i class="fa fa-globe" aria-hidden="true"></i>

即可

这样引用会自动调整大小与周围字体相同。上述例子——

因为是矢量图标,所以不用担心放大网页后是否像素化。使用Font Awesome,可以更好的为你的网站增色

 

那么,图标库在哪里?

点我前往Thinkcmf搜索

开始使用吧,美化你的网站 :cup: