网站上使用Font Awesom图标教程

热门标签

admin

发表文章数:3203

首页 » 网络资源 » 正文

本文介绍在网站上如何使用Font Awesom图标。

通常给我们的导航栏上加上一个图标,既直观又美观,像这样的:

网站上使用Font Awesom图标教程

那么该怎么设置呢?

可以直接引用,代码可以这样写:

<link rel=”stylesheet” href=”https://use.fontawesome.com/releases/v5.8.2/css/all.css”  integrity=”sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay” crossorigin=”anonymous”>

但是这样有一个问题是加载会比较慢,为了提高速度可以直接把文件下载下来,放到自己的网站里,比如版本5.8.2。

下载地址:

https://use.fontawesome.com/releases/v5.8.2/fontawesome-free-5.8.2-web.zip

下载速度会比较慢,这也是需要放在自己网站的原因。

网页上用的话,只需要两个文件夹及里面的文件就可以了:css与webfonts,并且保证这两个文件在同一个文件夹里。

网站上使用Font Awesom图标教程

引用方法:在<head>与</head>之间加上:

<link href=”/your-path-to-fontawesome/css/all.css” rel=”stylesheet”>

使用方法:

<i class=”fas fa-user”></i>

常见的方法是:

<li id=”nvabar-item-index”><a href=”https://wiz.ren/”><i class=”fa fa-home”></i>&nbsp;首页</a></li>

需要什么样的图标直接在网站上查找,地址是:

https://fontawesome.com/icons

标签:

未经允许不得转载:作者:admin, 转载或复制请以 超链接形式 并注明出处 夜河资源网
原文地址:《网站上使用Font Awesom图标教程》 发布于2019-12-05

分享到:
赞(0) 打赏

评论 抢沙发

9 + 5 =


撰写不易~如果您觉得文章对您有帮助的话可以打赏我哦~谢谢亲亲~

支付宝扫一扫打赏

微信扫一扫打赏

外服网游加速器破解版
包含腾讯网游加速器、海豚网游加速器等八款知名加速器,可加速外服游戏,永久包售后包更新,不定时添加新款破解版加速器!
切换注册

登录

忘记密码 ?

切换登录

注册