图标字体使用方法

一：图标字体特点

1. 兼容性好（从IE4 开始支持）。
2. 一定程度会替代精灵图。
3. 只能是纯色不能加渐变，简约。
4. 本身是一个字，修改方便。（用font和color属性可以直接修改）。
5. 加在速度快。
6. 也可自己制作。

二．图标字体使用方法

1.上阿里巴巴字体库下载需要的图标加入购物车一键下载。下载完文件夹中有以下几个文件。把黄色区域中的四个文件拷贝到站点目录下的font（自己建立）文件夹下。（四个文件夹为了兼容不同浏览器）

 

 

 

 

2.打开demo.html拷贝以下一段话到html文件中

 

 

如下。

其中“iconfont”为字体名称可以自己修改，另外 文件路径需要修改。

3在需要调用文字图标的地方声明字体格式，也可调整字体大小来调整字体格式，也可改变

颜色。如下。

 

 

 

4.打开demo.html 拷贝如下黄色区域中的编码到相应需要使用图片的区域。此时就会显示相应的图标。