在程序中使用自己设计的ICON图标

简介: 使用thymeleaf模板引擎,少不了图标,常用的图标库:FontAwesome、glyphicons;那么如何把自己设计的图标引用到自己的程序中去呢?

要想使用自己设计的图标到程序中去,我们需要借助一个网站,阿里矢量图 https://www.iconfont.cn/
注册个账号,在资源管理中创建项目,自己使用AI去设计图标,然后上传到自己项目中去,点击下载至本地
image.png

会得到压缩包,解压后看到这些东西
image.png

把上图中除demo.css和demo_index.html外,都上传至自己项目的static下的font中,在页面中引用iconfont.css,使用的时候,在class中添加
image.png

即可

目录
相关文章
|
5月前
|
前端开发 JavaScript
Elementplus如何使面包屑往左边移动,右边头像下拉菜单如何写,下拉菜单如何靠中一点,下拉菜单出现文字不对齐怎么办,如何设置鼠标样式,如何使用阿里妈妈icon,如何点击icon全屏
Elementplus如何使面包屑往左边移动,右边头像下拉菜单如何写,下拉菜单如何靠中一点,下拉菜单出现文字不对齐怎么办,如何设置鼠标样式,如何使用阿里妈妈icon,如何点击icon全屏
Elementplus如何使面包屑往左边移动,右边头像下拉菜单如何写,下拉菜单如何靠中一点,下拉菜单出现文字不对齐怎么办,如何设置鼠标样式,如何使用阿里妈妈icon,如何点击icon全屏
|
7月前
|
XML Java Android开发
Android Studio App开发中工具栏Toolbar、溢出菜单OverflowMenu、标签布局TabLayout的讲解及实战(实现京东App的标签导航栏,附源码)
Android Studio App开发中工具栏Toolbar、溢出菜单OverflowMenu、标签布局TabLayout的讲解及实战(实现京东App的标签导航栏,附源码)
669 0
|
iOS开发
iOS 启动图设置及icon图标设置
OS 启动图设置及icon图标设置
845 0
iOS 启动图设置及icon图标设置
|
小程序 文件存储
【易售小程序项目】顶部导航栏和底部导航栏设置+iconfont图标引入
【易售小程序项目】顶部导航栏和底部导航栏设置+iconfont图标引入
116 0
|
C#
全网首发:C#中Form设置$this.Icon,任务栏图标错误的解决办法(bitmap转icon)
全网首发:C#中Form设置$this.Icon,任务栏图标错误的解决办法(bitmap转icon)
311 0
|
计算机视觉
Qt实用技巧:QWidget中QPushButton成为可点击的图标(实现全透明,不论点击与否都只显示Icon)
Qt实用技巧:QWidget中QPushButton成为可点击的图标(实现全透明,不论点击与否都只显示Icon)
unity3dUGUI实现icon图标自动与数字对齐
有时候需要显示货币和数量,特别是商店和道具用的最多,需要一个icon和一个数字,比如数字右对齐,icon根据count进行右移,效果如下 测试.
1655 0