热门标签

特别声明:文章多为网络转载,资源使用一般不提供任何帮助,特殊资源除外,如有侵权请联系QQ403593407!本站提供的所有教程/文章/软件均仅供测试学习,造成的后果与本站无关!请不要用作非法用途,本站将记录用户下载记录做保存,如用户后期有违法行为方便提供给警方。

本文介绍在网站上如何使用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)

评论 抢沙发

7 + 3 =


电信无限流量卡
无限流量卡限时9.9元全国包邮!不限速无套路!25元/月享100G流量!35元/月享200G流量!55元享受500G流量!!
切换注册

登录

忘记密码 ?

您也可以使用第三方帐号快捷登录

Q Q 登 录
微 博 登 录
切换登录

注册