html/jsp 界面引入阿里巴巴矢量图标

时间:2024-03-23 07:17:07

html/jsp 界面引入阿里巴巴矢量图标

  1. 登录阿里巴巴 https://www.iconfont.cn/
  2. 找到自己需要的图标并且添加入库,然后点击购物车按钮
    html/jsp 界面引入阿里巴巴矢量图标
  3. 下载代码并且解压
    html/jsp 界面引入阿里巴巴矢量图标

4.选中以下文件到你的项目中,一般都放在css文件中
html/jsp 界面引入阿里巴巴矢量图标
5. 确保css文件中的路径正确,也就是第4步导入文件的路径
html/jsp 界面引入阿里巴巴矢量图标
6. 在html页面或者jsp界面引入iconfont.css文件,引入路径需要换成你们存放iconfont.css的路径( 注意 ! 有时直接引入iconfont.css会出现404,可以重新创建一个css文件,将iconfont.css中的内容放到新建的css文件中,再引入新建的css文件即可)
html/jsp 界面引入阿里巴巴矢量图标
7.找到对应图标的代码,在下载的文件夹中的demo_index.html可以查看,也可以去官网查看
html/jsp 界面引入阿里巴巴矢量图标
html/jsp 界面引入阿里巴巴矢量图标
8. 在界面中引入相应的icon图标
html/jsp 界面引入阿里巴巴矢量图标
9. 最后激动人心的时候到了,启动项目,icon引入完成
html/jsp 界面引入阿里巴巴矢量图标