当前位置:   article > 正文

element 中使用自定义图片icon图标_el-icon-

el-icon-

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

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

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

如:

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

本文内容由网友自发贡献,转载请注明出处:https://www.wpsshop.cn/w/不正经/article/detail/459665
推荐阅读
相关标签
  

闽ICP备14008679号