图解使用iconfont在线引用

搜索你需要的图标并加入购物车


搜索你需要的图标并加入购物车

选好之后选择储存为新项目


以在线引用为例,点击存储为新项目:


点储存

生成在线链接

点生成在线链接

复制到CSS中

复制到你网页里的CSS中

当然也可以是style标签里面。

  • !!! 注意:在本地调试的时候(就是当你的浏览器网址是file协议开头的时候),url(//)里双斜杠之前记得加上https:,像这样url(https://at.alicdn.com...),不然会用file协议访问链接,也就自然找不到了。

和本地使用一样


在css中定义一个class:

.iconfont{
    font-family:"iconfont";
    font-size:16px;
    font-style:normal;
}
  • 把刚刚@font-face里定义的字体用起来!

在需要位置(html),这么用:

  <i class="iconfont">*****</i>

i 标签里填这个:


想用哪个就写哪个 在 i 标签里

本教程版权归 张宇 所有,转载须说明来源

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容