十步搞定uni-app使用字体图标的方法

 更新时间:2020年04月01日 10:32:27   作者:从人到猿  
uni-app是一个使用Vue.js开发跨平台个人文库应用的前端框架,开发者编写一套代码,可编译到的iOS,安卓,H5,小程序等多个平台。这篇文章主要介绍了十步搞定uni-app使用字体图标的方法,需要的朋友可以参考下

uni-app简介

uni-app是一个使用Vue.js开发跨平台应用的前端框架,开发者编写一套代码,可编译到iOS、Android、H5、小程序等多个平台。

  uni-app框架由Dcloud即数字天堂(北京)网络技术有限公司推出,该公司主要产品有Web开发IDE Hbuiler、HbuilderX,前端框架mui、uni-app,增强版的手机浏览器引擎H5plus等。

uni-app中使用字体图标图标的下载

首先去阿里图标库选择要用的图标,并且打包下载下来,步骤如下

1.

在这里插入图片描述

2.

在这里插入图片描述

3.

在这里插入图片描述

4.

在这里插入图片描述

5.

在这里插入图片描述

6. 本地文件选取

在这里插入图片描述

7. 粘贴到uni-app项目下的static静态资源文件下

在这里插入图片描述

8. 把下载好的图标包里的iconfont.css内的代码粘贴到uni-app项目中的App.vue文件内

在这里插入图片描述

9. 在红色标记框的前面对路径进行修改

蓝色的框选是添加的

在这里插入图片描述

10. 使用

查看下载包内的demo_index.html文件

在这里插入图片描述

总结

到此这篇关于十步搞定uni-app使用字体图标的方法的文章就介绍到这了,更多相关uni-app 字体图标内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Prompt 编程产生背景技术原理应用实例解析

    Prompt 编程产生背景技术原理应用实例解析

    这篇文章主要为大家介绍了Prompt 编程产生背景技术原理应用实例解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-11-11
  • zend studio 快捷键收集

    zend studio 快捷键收集

    zend studio 快捷键收集,提高开发效率。
    2009-11-11
  • 搜索历史基本原理实现即时自动补全联想搜索技巧

    搜索历史基本原理实现即时自动补全联想搜索技巧

    这篇文章主要为大家介绍了搜索历史基本原理实现即时自动补全联想搜索技巧示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-02-02
  • pycharm中venv文件夹自定义处理方式图解

    pycharm中venv文件夹自定义处理方式图解

    这篇文章主要为大家介绍了pycharm中venv文件夹自定义处理方式图解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-04-04
  • Scratch3.0初始化加载七牛云上的sbs文件的方法

    Scratch3.0初始化加载七牛云上的sbs文件的方法

    今天通过本文给大家介绍Scratch3.0初始化加载七牛云上的sbs文件的实例代码,代码简单易懂,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧
    2021-08-08
  • Commitizen来规范代码提交信息使用技巧

    Commitizen来规范代码提交信息使用技巧

    这篇文章主要为大家介绍了Commitizen来规范代码提交信息使用技巧详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-03-03
  • Postman测试报告的生成方法

    Postman测试报告的生成方法

    做完测试后,都会编写一份测试报告,测试报告中最主要的就是呈现出测试结果,哪些用例通过了,哪些用例没有通过。像postman这么强大的功能也可以自动生成报告,供我们测试同学进行查看,显得更加有B格
    2022-01-01
  • git分支或指定文件回退到指定版本命令详解

    git分支或指定文件回退到指定版本命令详解

    作为一名后端开发,相信大家一定遇到过这样的情景,代码开发人员过多,并且开发分支过多,导致代码版本管理困难,这样就难免遇到一些代码合并出错,下面这篇文章主要给大家介绍了关于git分支或指定文件回退到指定版本命令的相关资料,需要的朋友可以参考下
    2023-12-12
  • MASA Blazor入门详细教程

    MASA Blazor入门详细教程

    MASA Blazor是一个基于 Blazor Component 和 Material Design 的 UI 组件库,接下来通过本文给大家介绍MASA Blazor入门详细教程,感兴趣的朋友一起看看吧
    2022-04-04
  • 使用HTTP_X_FORWARDED_FOR获取客户端IP的严重后果

    使用HTTP_X_FORWARDED_FOR获取客户端IP的严重后果

    我的建议是不要再使用上面的方法去获取客户端IP.即是不要再理会代理情况.
    2009-11-11

最新评论