前端使用iconfont图标技巧（无需下载字体文件到本地）

1.将图标添加到购物车

image.png

2.将购物车的图标添加到项目中（可自己新建）

image.png
image.png
image.png

3.生成线上引用地址
_1.刷新代码

image.png

_2.复制链接地址
注意：这里生成的链接地址，并不能直接使用，需要在url后面加上

 https://

例如我在html中引用iconfont图标就是：

<style>
    @font-face {
        font-family: 'iconfont';
        /* project id 1580545 */
        src: url('https://at.alicdn.com/t/font_1580545_97ftmamxgsf.eot');
        src: url('https://at.alicdn.com/t/font_1580545_97ftmamxgsf.eot?#iefix') format('embedded-opentype'),
            url('https://at.alicdn.com/t/font_1580545_97ftmamxgsf.woff2') format('woff2'),
            url('https://at.alicdn.com/t/font_1580545_97ftmamxgsf.woff') format('woff'),
            url('https://at.alicdn.com/t/font_1580545_97ftmamxgsf.ttf') format('truetype'),
            url('https://at.alicdn.com/t/font_1580545_97ftmamxgsf.svg#iconfont') format('svg');
    }

</style>
 .icon {
  /* 引用iconfont图标 */
        font-family: "iconfont";
        font-size: 36px;
    }

如果你觉得这篇文章对你有帮助的话，可以在支付宝首页搜索：587954734 领取红包，给小编谋个鸡骨头福利哦。