Vue 项目 iconfont 配置

目录


下载

iconfont官网 -> 我的项目 -> 下载至本地 -> 解压 -> 得到 iconfont.css 文件


项目中添加css文件

  • 将 iconfont.css 拷贝到项目目录中，放css文件的目录下
  • 打开编辑 iconfont.css ，将 .iconfont{} 后面所有的内容删除
  • 将本地字体文件替换为线上字体
    1. 复制线上链接。iconfont官网 -> 我的项目 -> 查看线上链接 -> 点此复制代码
    2. 替换线上链接，编辑 iconfont.css ，替换 @font-face { ... } 相关内容

项目中引用

  • 导入
// main.js
import './style/iconfont.css'
  • 使用
<div class="iconfont">&#xe600;</div>
posted @ 2022-02-17 20:19  Better-HTQ  阅读(132)  评论(0)  编辑  收藏  举报