不得不说uniapp引入iconfont确实比较坑。下面方法可行：

引入方法：

1.在confont官网找好图标，然后点击复制代码，

2.点击红圈的复制代码后在网页打开，出现如下：

3.然后再uniapp项目下新建common文件夹,common文件夹下新建iconfont.css。把2步打开的代码复制到iconfont.css。记住要将iconfont.css文件内url路径转换为在线路径即加上https:如下：

4.在App.vue中全局引入该文件@import "./common/iconfont.css",

5.接着在组件中引用就可以了

<text class="iconfont icon-tuikuanshouhou"></text>

效果：

uniapp引用iconfont图标的更多相关文章

  1. 微信小程序如何引用iconfont图标

    最近在研究微信小程序,自己写demo的时候想要引用巴里巴巴图标库的图标,于是: @font-face { font-family: 'iconfont'; src: url('iconfont.eot ...

  2. uni-app 使用 iconfont 图标 自定义图标

    uni-app 的uni-ui 的 Icon 图标组件,裡面的图标只是移动端常见的图标,对于一些其他需求所要显示的图标,这个是完全不够用.那么怎么办?模仿它的组件,用阿里巴巴图标矢量库的图标,自己定义 ...

  3. uniapp 使用iconfont图标

    步骤一 新建项目 步骤二 导入需要的图标,然后下载图标代码 步骤三  打开下载的压缩文件中的iconfont.css 步骤四 复制粘贴到项目中 步骤四在项目中使用 use in page

  4. 微信小程序引用iconfont图标字体解决方案；

    1)首先,登录阿里巴巴iconfont.cn 2)新建项目 3)点击icon收藏 4)加入到test项目中   5)下载到本地解压   6)生成代码   7)复制iconfont.css到xxx.wx ...

  5. 如何引入iconfont图标与Element-UI组件

    一.iconfont图标 iconfont方便又好用,介绍一下如何在vue项目中引入iconfont 1.进入iconfont官网 www.iconfont.cn 2.登录自己账户 3.选择图标后下载 ...

  6. 使用iconfont图标

    iconfont.cn基本使用 登录iconfont.cn网站,直接使用github账号即可登录 输入关键字搜索需要的图标,然后在需要的图标上点击'添加入库' 点击网站右上角的购物车图标,查看当前已入 ...

  7. iconfont图标应用

    一.什么是iconfont? 我们现在通常所指的iconfont,是用字体文件取代图片文件,来展示图标.特殊字体等元素的方法.iconfont是阿里巴巴矢量图标库是由阿里巴巴体验团队倾力打造的中国第一 ...

  8. veu——引入iconfont图标

    我这里是阿里的iconfont图标,如何下载请看下面这个博文 https://www.cnblogs.com/wangyang0210/articles/9248324.html 创建文件夹 在ass ...

  9. 仿站技术——获取和使用某些网站的iconfont图标字体

    前言: 很多前端新手在仿一些大型网站的时候经常遇到一个问题:该网站使用了图标字体——iconfont,虽然现在阿里有开源的iconfont库,但是还是没有原网站的效果(本人强迫症但非处女座).所以此文 ...

随机推荐

  1. win10安装tensorflow (cpu版)

    前提: 下载anaconda,然后创建一个python虚拟环境: 命令: conda create -n tf_cpu python=3.6       # (tf_cpu  是这个虚拟环境的名字) ...

  2. cm日志的清理

    #过一段时间后,cm server的空间越来越大 #删除日志/bin/rm /var/lib/cloudera-host-monitor/ts/*/partition*/* -rf/bin/rm /v ...

  3. [转帖]FreeBSD、OpenBSD、NetBSD的区别

    FreeBSD.OpenBSD.NetBSD的区别 Linux 的历史 http://www.361way.com/unix-bsd/1513.html   一直unix在我心目中的地位都很高,uni ...

  4. Spring 最常用的 7 大类注解，史上最强整理！

    随着技术的更新迭代,Java5.0开始支持注解.而作为java中的领军框架spring,自从更新了2.5版本之后也开始慢慢舍弃xml配置,更多使用注解来控制spring框架. 而spring的的注解那 ...

  5. loj 6031「雅礼集训 2017 Day1」字符串

    loj 注意到每次询问串长度都是给定的,并且询问串长\(k*\)询问次数\(q<10^5\),所以这里面一个东西大的时候另一个东西就小,那么考虑对较小的下功夫 如果\(k\le \sqrt{n} ...

  6. call，apply，bind的理解

    call,apply,bind均是用于改变this指向. 三者相似之处: 1:都是用于改变函数的this指向. 2:第一个参数都是this要指向的对象. 3:都可以通过后面的参数进行对方法的传参. l ...

  7. mybatis查询返回的对象不为null，但是属性值为null

    返回的对象不为null,但是属性值为null 代码如下: <resultMap id="BaseResultMap" type="com.trhui.ebook.d ...

  8. TensorFlow入门——安装

    由于实验室新配了电脑,旧的电脑就淘汰下来不用,闲来无事,就讲旧的电脑作为个人的工作站来使用. 由于在旧电脑上安装的是Ubuntu 16.04 64bit系统,系统自带的是Python 2.7,版本选择 ...

  9. mysql truncate 与 delete的相同点和不同点

    相同点 都可以清空表,自增字段将起始值恢复成1 [delete from table_name where 1 可以保持自增的最大值] delete from table_name; truncate ...

  10. Centos 7安装部署zabbix 3.0LTS

    1.环境准备 OS:CentOS 7.2 64bit Zabbix版本:3.0.12 MySQL版本:5.6 注意:zabbix3.0相关要求 mysql5.0以上版本.apache1.3以上版本.p ...