Use svg to create an icon font on iconmoon, name it sell-icon, copy the four files (sell-icon.eot\sell-icon.svg\sell-icon.ttf\sell-icon.woff)in its fonts folder into the common fonts folder, import the style.css file into common/stylus, and change it to stylus. Format (remove parentheses and semicolons) and rename it to icon.styl.
And icon.styl has:
@font-face {
font-family: 'sell-icon';
......
}
......
.icon-keyboard_arrow_right:before {
content: "\e900";
}
And I want to use it in head.vue
<template>
......
<i class="icon-keyboard_arrow_right"></i>
......
</template>
.......
<style lang="stylus" rel="stylesheet/stylus">
@import "../../common/stylus/mixin"
.....
.icon-keyboard_arrow_right
margin-left: 2px
line-height: 24px
font-size: 10px
</style>
But unlucky, icon-keyboard_arrow_right does not appear in my web page.It seems nothing wrong in my code.
Who can help me?