备案控制台
开发者社区 开发与运维 文章 正文

项目中自定义icon(类似ElementUI的icon)

2022-11-26 143
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： 项目中自定义icon(类似ElementUI的icon)

项目中需要自定义icon，在项目中通用


  • html使用
<i class='icon-save'></i>


  • css样式
.icon-save {
  /*使用自己的图片来替换*/
    background: url('图片地址') center no-repeat; 
    background-size: contain;
}
.icon-save::before {
 /*before属性中的content文本是用来占位的,必须有*/
    content: 'save'; 
    font-size: 12px; /*可以设置字体大小来确定图标大小*/
    visibility: hidden;
}


文章标签：
前端开发
猫先生c
目录
相关文章
你挚爱的强哥
|
1月前
|
小程序 JavaScript
【微信小程序】之轮播图、swiper、swiper-item、banner组件使用
【微信小程序】之轮播图、swiper、swiper-item、banner组件使用
你挚爱的强哥
52 0
【微信小程序】之轮播图、swiper、swiper-item、banner组件使用
我是夜阑的狗
|
1月前
|
小程序
【微信小程序】-- 其它常用组件介绍 -- button & image（八）
【微信小程序】-- 其它常用组件介绍 -- button & image（八）
我是夜阑的狗
41 0
bigwhite大白
leaflet之自定义marker Icon
版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/gisdoer/article/details/82454606 leaflet之自...
bigwhite大白
3496 0
破浪前进
|
1月前
|
移动开发 JavaScript 小程序
uView Icon 图标
uView Icon 图标
破浪前进
54 2
破浪前进
|
1月前
|
JavaScript 测试技术 iOS开发
vue element plus Icon 图标
vue element plus Icon 图标
破浪前进
69 0
晓同哇哇~
|
1月前
|
JavaScript
uniapp用picker实现自定义三级联动（children）
uniapp用picker实现自定义三级联动（children）
晓同哇哇~
79 0
好名字0821
|
6月前
|
JavaScript 编译器 开发者
uniapp复选框自定义样式&data数据与style交互
uniapp复选框自定义样式&data数据与style交互
好名字0821
71 0
阿甘兄
|
8月前
|
JSON 数据格式
05zTree - 自定义图标（icon 属性）
05zTree - 自定义图标（icon 属性）
阿甘兄
120 0
小铁匠loven
|
8月前
|
JavaScript 前端开发
Vue 打包后bootstrap icon 图标不显示了
在Vue脚手架项目中使用bootstrap icon图标，dev模式正常，打包后图标不显示了
小铁匠loven
69 0
授客
|
前端开发 测试技术
Easyui 修改|新增jquery-easyui icon图标
Easyui 修改|新增jquery-easyui icon图标
授客
96 0