前端——阿里图标的使用详解
首先进入阿里图标首页进行登陆，有三种登陆方式，本人用新浪微博进行登陆。
可在搜索框输入指定的图标样式，选中的图标加入购物车，本人建议最好一次性将所需要的图标都加入到购物车中，方便避免重复进行。
图标加入购物车后，点击右上角的购物出。
点击新建一个项目
输入项目的名称并点击确认
点击Font-class和查看在线连接，若没有连接，点击红色的生产连接即可，就出现了一个css样式的连接。这个样式里储存了你项目里所有选中的图标。
可以复制这个连接，在网页中打开这个链接。可以看到这些图标有一个总的样式，属性名叫iconfont，所以在使用这个图标时，一定要加上这个属性。然后五个图标各自有一个独立的样式，分别叫icon-weixin、icon-weixin1、icon-weixin2、icon-weixin3、icon-weixin4、icon-weixin5。
下面简单展示下这几个图标，要注意的是，处理阿里图标样式可以与文字处理一样。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="http://at.alicdn.com/t/font_923612_bsbnso2jta.css">
<style>
*{
margin: 0;
padding: 0;
}
span.icon-weixin5{
font-size: 50px;
}
span.icon-weixin4{
font-size: 50px;
}
span.icon-weixin3{
font-size: 50px;
}
span.icon-weixin2{
font-size: 50px;
}
span.icon-weixin1{
font-size: 50px;
}
</style>
</head>
<body>
<span class="iconfont icon-weixin4"></span>
<span class="iconfont icon-weixin5"></span>
<span class="iconfont icon-weixin3"></span>
<span class="iconfont icon-weixin2"></span>
<span class="iconfont icon-weixin1"></span>
</body>
</html>
