字体图标学习

132 阅读1分钟

特点. 1.字体图标展示的是图标,本质是字体 2.处理简单,颜色单一的小图标 3.轻量级,体积小,渲染快,降低服务器请求次数 4.兼容性,几乎兼容所有主流的浏览器 5.使用方便

常用地址 www,icont.cn 阿里巴巴字体库

使用方法 类名. 1.引入下载好的字体样式css,或者字体库里生成的项目链接

1.jpg下载好的

image.png网站生成的

2.找个标签装字体,一般用i标签,选择两个类名,一个是表示字体图标,一个表示css样式中的某个图标类名 image.png

unicode编码 1.引入下载好的字体样式css,或者字体库里生成的项目链接 2找个标签装字体,必须要添加类名iconfont 表示为字体图标.此编码在css样式中设置好,浏览器解析成字体图标!编码写在标签内容中 image.png

伪元素. 1.引入下载好的字体样式css,或者字体库里生成的项目链接(使用伪元素显示字体图标,一定要记得在伪元素的父级声明字体 font-family: "iconfont") 2.为目标设置伪元素,

image.png

\ 符号是部分编码在content中的写法.

\e600 为编码.在字体图标css样式中查看