前端开发如何在自己项目中引用iconfont图标

前端开发如何在自己项目中引用iconfont图标！下面展示一下，详细的引入步骤。

第一步，您需要注册一个会员账号登录进入。创建一个项目。

可以使用其他的平台账号登录，我选了是微信登录，不过他们还会要求你输入手机号，通过短信验证码完成身份验证后，才能正常登录成功。

创建自己的项目就行了。随便写了一个test的名字。

这是演示的，所以我只勾选到2个图标。作为演示使用。

---

如图，1，你可以选择在线引入，他们官方会给你提供一个引入的地址。默认是看不见的，你点击一下，打开那个图标就可以看见引入的地址信息了。复制地址，就可以在自己的项目里面引入使用了。

或者你喜欢下载到本地导入也可以的。

如图，我下载了一份到本地了，里面是一个压缩包。里面有2个文件是我们项目使用的。

第一个是iconfont.css。另外一个是iconfont.ttf

分别存入你的css文件夹下，和你的font文件下面。

我们下面演示的内容是使用的在线导入地址的模式。

---

如图，我们在index.html文件内加如了这个地址。就可以使用图标了。

---

使用方法很简单。我们使用的是：【<li><a href="javascript:;"><i class="iconfont icon-user"></i>周杰伦</a></li>】

使用i图标的模式做调用！前面的iconfont是固定的，不能改动。后面那个icon-user.是图标的名字。

---

如图，正常显示了这个图标。是一个小的人的形状。

---

声明：实际上项目可能会使用很多很多图标，你自己把它们都集中存入你的项目内就行了。

这样，就可以一次性全部加载过来使用了。我这里仅仅是教程，所以引用了2个而已。