icon 使用方法打开阿里巴巴矢量图标库搜索，添加至库，添加至项目生成源码生成源码添加至自己所需代码上标签类名必须写入c

打开阿里巴巴矢量图标库
搜索，添加至库，添加至项目
生成源码
生成源码添加至自己所需代码上
标签类名必须写入class = 'iconfont'
可添加新的类名用来改变某个图标的样式
选中标签样式写
font-family: "iconfont";
font-style: normal;

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        @font-face {
            /* 定义一个字体家族！！！ */
            font-family: 'iconfont';  /* project id 1722654 */
            src: url('./fonts/iconfont.eot') format('embedded-opentype'),
            url('./fonts/iconfont.woff2') format('woff2'),
            url('./fonts/iconfont.woff') format('woff'),
            url('./fonts/iconfont.ttf') format('truetype'),
            url('./fonts/iconfont.svg') format('svg');
        }
        
        /* 选择器 */
        [class^="iconfont"],
        [class*=" iconfont"]{
            font-family: "iconfont";
            font-style: normal;
        }

        /* 属性选择器 */
        /* [class^="iconfont"],
        [class*=" iconfont"], */

        i.icon-message::before {
            content: '\e602';//此处指的就是&#xe63b；
            color: red;
            font-size: 30px;
        }
    </style>
</head>
<body>
    <i class="iconfont icon-message">&#xe63b;</i>
</body>
</html>