字体图标
图标默认使用 feather 所提供的 SVG icon。
如需使用其他类型的图标，请自行引入 相关 CSS 和字体，如 FontAwesome：
<link href="https://lib.baomitu.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" />
效果展示
下面两个图标，分别是内置的 feather 和另外引入的 FontAwesome 效果。
<c-icon type="feather" name="github" color="#498ff2" size="36" valign="middle" />
<c-icon type="fa" name="github" color="#498ff2" size="40px" valign="middle" />
像 FontAwesome 这种外部图标的使用，是通过 <i> 标签及其 class 值 {类型} {类型}-{图标名} 实现的。例如，根据 font-mfizz 的文档，图标使用方式为 <i class="icon-angular"></i>，则使用方法如下：
<div class="custom-icons">
<c-icon type="icon" name="angular" color="red" size="3em" valign="middle" />
<c-icon type="icon" name="reactjs" color="blue" size="3em" valign="middle" />
<c-button primary>
<c-icon type="icon" name="angular" />
<span>测试</span>
</c-button>
</div>
<style>
/* 请自行引入 font-mfizz.css */
.custom-icons .c-icon {
margin-right: 20px;
}
</style>
另外，还能兼容使用了 ligature 技术的字体图标（如 Material Icons）。
face
<c-icon
ligature
type="material-icons"
name="face"
color="#212121"
size="3em"
valign="middle"
/>
<style>
/* 请自行引入 material-icons.css */
</style>
属性说明
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| type | String | feather | 标识图标类型，一般是公共类名或公共类名前缀 |
| name | String | 无，必填 | 图标名称 |
| color | String | - | 默认继承 |
| size | String | 1em | 字体大小，可使用合法单位 |
| valign | String | baseline | vertical align |
| ligature | Boolean | false | 是否是 ligature |
Feather 图标集合
下面列出了 feather 中的全部图标，点击可复制对应标签：
FontAwesome 图标列表
下面列出了 FontAwesome 中的全部图标，点击可复制对应标签：
数据加载中....