2017 阿里巴巴矢量图标库 导入所选图标到jsp页面步骤
来源:互联网 发布:龙渊网络 编辑:程序博客网 时间:2024/06/14 08:30
阿里巴巴矢量图标库 导入所选图标到jsp页面步骤,给新手看的,自己也是第一次使用,希望对其他人有帮助,因为看到网站很多博客,都说的不是很清楚,避免有人走弯路。
1.需要注册一个github账号:
登陆阿里巴巴矢量图标库网站,选择自己想要的图标,添加入库,可以连续添加好几个的,如下图:
2. 进入你的购物车,也就是那个库里面,选择“下载代码”,会出现一个zip的包,随便下载到本地的目录,进行解压:
3.下载完之后,就可以看到很多文件,我们如果要直接在jsp使用他们的图标的话,只需要这五个文件,如下图:
其中demo_unicode里面打开可以看到你选择的这四个图标对应的unicode码,这个就是放在你的jsp页面的图片代码。
4.导入iconfont.css,iconfont.ttf,iconfont.woff导入到你的web工程webroot里面,一般是放在css文件夹里面,如下我的工程目录:
5.导入这些文件,如果要在jsp页面使用这4个图标的话,就需要导入这些css,其他两个iconfont.tff/iconfont.woff文件和css文件在同一级目录即可,如下图:
6.最后一步就是引用你的图标了,在demo_unicode.html选择其中一个图标的unicode代码放到想要的地方即可,如下代码:<iclass="iconfont">3</i>
至此大功告成,运行结果如下:
- 2017 阿里巴巴矢量图标库 导入所选图标到jsp页面步骤
- 阿里巴巴矢量图标库
- Iconfont-阿里巴巴矢量图标库
- 阿里巴巴矢量图标库
- 阿里巴巴矢量图标库使用
- 阿里巴巴矢量图标库
- 阿里巴巴矢量图标库
- UI工具-阿里巴巴矢量图标库
- ionic 使用Iconfont-阿里巴巴矢量图标库
- Ionic使用Iconfont-阿里巴巴矢量图标库
- Iconfont-阿里巴巴矢量图标库的SVG玩法
- 项目开发必备:Iconfont-阿里巴巴矢量图标库
- Element引入Iconfont(阿里巴巴矢量图标库)第三方图标库
- 使用阿里巴巴图标库生成iconfont字体图标
- 使用阿里巴巴图标库生成iconfont字体图标
- 矢量图标库
- 阿里巴巴矢量图标引用问题
- Android 开发中 阿里巴巴矢量图标库 IconFont的使用详解
- ABBYY FineReader识别图片中文本的教程
- 文件下载
- ERROR 1045 (28000)Access denied for user root localhost using passwordNO
- qualcomm QSD MSM APQ区别
- chromium浏览器的编译
- 2017 阿里巴巴矢量图标库 导入所选图标到jsp页面步骤
- 自定义Dialog,第二次点击item报The specified child already has a parent. You must call removeView() on the chil
- cmd打开某个目录下的程序
- 前端插件Bootstrap之下拉选学习(一)
- eclipse 等号左边代码自动补全,自动提示返回对象
- vi编辑器(1)
- CSDN专访雷果国:从1.5K到18K 一个程序员的5年成长之路
- CentOS 6.5下Squid代理服务器的安装与配置
- C++实现哈夫曼编码--使用哈夫曼编码树压缩和解压缩