ingrun

Appearance

Return to top
本页目录

Element-ui 使用三方ICON 库（ 阿里Iconfont ）

项目中新增文件

css
/* ali-icon.css */

@import "//at.alicdn.com/t/c/font_******_i14e6txa4f.css";

[class^="ali-icon-"], [class*="ali-icon-"]
{
  font-family:"iconfont" !important;
  font-size:18px;
  font-style:normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
1
2
3
4
5
6
7
8
9
10
11
12
13

在 main.js 中引用该文件

js
// main.js
import "@/styles/ali-icon.css"; // 引用阿里icon在线库
1
2

直接使用

html
<i class="ali-icon-save"></i>
1

新增图标只要修改引入的在线地址就好

css
/* ali-icon.css */

/* @import "//at.alicdn.com/t/c/font_******_i14e6txa4f.css"; */
@import "//at.alicdn.com/t/c/font_*******_858akyl9m3y.css"; /* 更新在线图标库 */

[class^="ali-icon-"], [class*="ali-icon-"]
{
  font-family:"iconfont" !important;
  font-size:18px;
  font-style:normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
1
2
3
4
5
6
7
8
9
10
11
12
13

markdown

markdown 使用图片

markdown
![imageName](url)
![示例](https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg)
1
2

示例