(前端)图标字体的使用方法

粗略的总结一下怎么使用图标字体

推荐两个我常用的图标字体库
第一个:https://www.iconfont.cn/search/index?searchType=icon&q=%E6%90%9C%E7%B4%A2
第二个:https://icomoon.io/ (下面也是以第二个为例子)

(前端)图标字体的使用方法
(前端)图标字体的使用方法
(前端)图标字体的使用方法

解压文件夹,压缩包尽量别删除,下次还可以用,但都在你

(前端)图标字体的使用方法
下面就是用起来!
(前端)图标字体的使用方法

@font-face {
            font-family: 'icomoon';
            src: url('../fonts/icomoon.eot?7kkyc2');
            src: url('../fonts/icomoon.eot?7kkyc2#iefix') format('embedded-opentype'), url('../fonts/icomoon.ttf?7kkyc2') format('truetype'), url('../fonts/icomoon.woff?7kkyc2') format('woff'), url('../fonts/icomoon.svg?7kkyc2#icomoon') format('svg');
            font-weight: normal;
            font-style: normal;
        }

路径真的很重要!!!!!
(前端)图标字体的使用方法
(前端)图标字体的使用方法

(前端)图标字体的使用方法
(前端)图标字体的使用方法
(前端)图标字体的使用方法

好勒 应该没了有问题再说吧~~~~~

上一篇:Shell、终端和控制台


下一篇:Linux驱动之I2C总线设备以及驱动