Use Ali vector icon library

Use Ali vector icon library

Official website

1, register
2, look for the icon, add to cart, pay attention to try to select the same set of icons icon library.
3, open the shopping cart icon to add the item (or click the + sign on the right, the new project).
4, find my project, use the download or use the online links to local codes

Use online Icon

1, write the font file icon code in base.css

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

.iconfont {
	font-family: "iconfont" !important;
	font-size: 16px;
	font-style: normal;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

2, the global configuration file reference base.css
3, html file using
 here is the corresponding Unicode font icon

<span class="iconfont">&#xe63c;</span>
<i class="iconfont">&#xe63c;</i>

Use the download icon

Icon download, decompress the packet, to obtain the following documents

using
1, after extracting file, the following five Kuangxuan font files are copied to the file in the project folder types

2, write font file icon code base.css

@font-face {
	font-family: 'iconfont';
	src: url('../font/iconfont.eot');
	src: url('../font/iconfont.eot?#iefix') format('embedded-opentype'),
		url('../font/iconfont.woff2') format('woff2'),
		url('../font/iconfont.woff') format('woff'),
		url('../font/iconfont.ttf') format('truetype'),
		url('../font/iconfont.svg#iconfont') format('svg');
}
.iconfont {
	font-family: "iconfont" !important;
	font-size: 16px;
	font-style: normal;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

Compared with online use, only the src into a local link, the rest of the steps are the same
3, the global configuration file reference base.css
4, html file using
 here is the corresponding Unicode font icon

<span class="iconfont">&#xe63c;</span>
<i class="iconfont">&#xe63c;</i>