font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。
与 Unicode 使用方式相比，具有如下特点：
- 相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。
- 因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。
下载使用步骤如下：
-
打开阿里巴巴矢量图标库
-
找到自己想要使用的样式（如图）
-
-
点击存入购物车（大多数图标都为免费，但这一操作需要登陆）
-
-
图标选择完成后，在自己的购物车中找到然后点击下方下载代码（如果没有的话试着调整浏览器显示尺寸到90%或者更低）
-
下载完成之后是一个压缩包，设计人员直接把压缩包直接交给代码人员即可。
-
代码人员将文件夹解压缩之后，新建一个iconfont文件夹（该文件夹与images、css等文件夹同级）并将如下图所示文件复制到iconfont文件夹中。
-
在html5中以引入的方式引入iconfont.css
-
在网页中以span或者i标签的方式引入，引入完成后需要赋予两个类名，格式为“iconfont+空格+图片类名”，图片类名在如图网页中：
复制完成时代码如下：
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<title>测试</title>
<meta charset="utf-8">
<link rel="stylesheet" href="./iconfont/iconfont.css">
</head>
<body>
<span class="iconfont icon-gouwuche"></span>
</body>
</html>
效果如图：
注：写字体图标样式时，要给图片类名写样式，不能给iconfont写。
815
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
