修改Element UI自带的icon,替换成自己的图片:

定义一个类名,icon使用类名:

.el-icon-类名 {
    background: url('你的图片路径') center center no-repeat;
    background-size: 24px;
}

如:

 .el-icon-date {
      background: url('../../../assets/icon/icon-date.png') center center no-repeat;
      background-size: 16px;
 }

 .el-icon-price {
      background: url('../../../assets/icon/icon-price.png') center center no-repeat;
      background-size: 16px;
 }

 .el-icon-arrow {
      background: url('../../../assets/icon/icon-arrow.png') center center no-repeat;
      background-size: 16px;
 }
<el-form-item class="formSelect" label="建议销售价">
    <el-col :span="11">
        <el-input placeholder="最低价" v-model="searchInfo.minSellPrice"
         suffix-icon="el-icon-arrow">
        </el-input>
    </el-col>
    <el-col class="line" :span="2">-</el-col>
    <el-col :span="11">
        <el-input placeholder="最高价" v-model="searchInfo.maxSellPrice"
          suffix-icon="el-icon-price">
        </el-input>
    </el-col>
</el-form-item>

GitHub 加速计划 / eleme / element
10
1
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:4 个月前 )
c345bb45 8 个月前
a07f3a59 * Update transition.md * Update table.md * Update transition.md * Update table.md * Update transition.md * Update table.md * Update table.md * Update transition.md * Update popover.md 8 个月前
Logo

旨在为数千万中国开发者提供一个无缝且高效的云端环境,以支持学习、使用和贡献开源项目。

更多推荐