web 字体和图标

web 字体

用户电脑上没有安装相应字体，强制让用户下载该字体

使用@font-face 指令制作一个新字体

/* 制作一个新的字体，名称叫做 good night */
@font-face {
  font-family: "good night";
  src: url("./font/晚安体.ttf"); //如果用户本地没有，浏览器会自动下载
}

p {
  font-family: "good night";
}

字体图标

iconfont.cn 阿里字体图标库

• 可选择在线方式
• 下载本地文件

/* 1. 将 字体图标下载到本地
   2. 取出对应的文件和css
   3. 引入文件，推荐使用类名的方式
*/

技巧:每一次添加一个新图表，都需要更新 CDN/或者重新下载文件，可以开发的时候先使用 CDN，等开发完成，再下载文件