在线链接到小图标

1、我的项目>查看在线链接>暂无代码，点击生成

2、使用

• Unicode
  ①、新建或复制iconfont.css文件，保留.iconfont
  ②、将@font-face复制进去，并添加http

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

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

  url('http//at.alicdn.com/t/font_1282571_64jp9sse1kj.svg#iconfont') format('svg');

• html+css
  ①、引入在线css文件

http://at.alicdn.com/t/font_1282571_64jp9sse1kj.css

②、在阿里>我的项目>图标>复制代码

image.png

③、在html中使用

<span class="iconfont icon-dianhua"></span>

• Symbol彩色图标
  ①、引入在线js文件
  ②、加入通用css代码

.icon {
/* 通过设置 font-size 来改变图标大小 */
    height: 1em;
    width: 1em;
/* 图标和文字相邻时，垂直对齐 */
    vertical-align: 0.15em;
/* 通过设置 color 来改变 SVG 的颜色/fill */
    fill: currentColor;
 /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
      normalize.css 中也包含这行 */
    overflow: hidden;
}

③、在阿里中获取图标类名

<span class="icon icon"></span>

复制类名