ExtJS 使用 Fonts Google 的方法(SVG图标通用)
更新记录
2023年5月19日 初始化。
ExtJS教程汇总:https://www.cnblogs.com/cqpanda/p/16328016.html
选择图标
进入网站:https://fonts.google.com/icons 搜索想要的图标
下载图标SVG文件转为base64
然后使用在线工具转为base64
https://products.aspose.app/imaging/zh-hans/conversion/svg-to-base64
在组件的scss文件中定义图标类
.icon-svg-material-symbols-outlined {
background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iNDgiIHZpZXdCb3g9IjAgOTYgOTYwIDk2MCIgd2lkdGg9IjQ4Ij48cGF0aCBkPSJtMjQ5IDg0OS00Mi00MiAyMzEtMjMxLTIzMS0yMzEgNDItNDIgMjMxIDIzMSAyMzEtMjMxIDQyIDQyLTIzMSAyMzEgMjMxIDIzMS00MiA0Mi0yMzEtMjMxLTIzMSAyMzFaIi8+PC9zdmc+");
background-size: contain;
width: 24px;
height: 24px;
}
在组件中使用
{
xtype: 'button',
text: 'button',
iconCls: 'icon-svg-material-symbols-outlined',
},
本文来自博客园,作者:重庆熊猫,转载请注明原文链接:https://www.cnblogs.com/cqpanda/p/17414311.html