uniapp使用字体图标

简介: uniapp使用字体图标

1.在阿里图标库下载需要的字体图标,选择好图标后点下载代码

iconfont-阿里巴巴矢量图标库

2.将下载的压缩包里面的ttf文件拷贝到uniapp项目的static文件夹

3.如果是要用到app的标题栏右上角,代码如下。

"\ue671",可以在iconfont.json文件的unicode

{
            "path" : "pages/index/index",
            "style" :                                                                                    
            {
                "navigationBarTitleText": "我的",
                "enablePullDownRefresh": true,
        "style": {
          "app-plus": {
            "titleNView": {
              "buttons": [{
                "text": "\ue671",
                "fontSrc": "static/iconfont.ttf",
                "fontSize": "22px"
              }]
            }
          }
        }
            }
        }


相关文章
|
12月前
|
缓存 小程序
微信小程序使用vant组件样式不生效的问题
微信小程序使用vant组件样式不生效的问题
594 0
|
1月前
|
JavaScript
uniapp实现瀑布流
uniapp实现瀑布流
|
1月前
uniapp图片预览
uniapp图片预览
|
1月前
uniapp实现瀑布流?
uniapp实现瀑布流?
|
1月前
Vuetify 明暗主题切换
Vuetify 明暗主题切换
55 0
|
1月前
|
前端开发 API
uniapp中uview组件库丰富的LoadingIcon 加载动画
uniapp中uview组件库丰富的LoadingIcon 加载动画
82 0
|
7月前
CSS3实现鼠标悬停动态效果(仿阿里云官方网站)
CSS3实现鼠标悬停动态效果(仿阿里云官方网站)
28 0
|
8月前
|
API 开发者 索引
Flutter笔记:发布一个多功能轮播组件 awesome_carousel
awesome_carousel 模块是一个Flutter轮播图模块。可以实现包括自定义指示器、动画、滚动等等众多功能。能够指定相当多地细节(可以参考 API 部分了解)本文给出 awesome_carousel 模块的两个简单的用法示例。
108 0
|
8月前
|
小程序 前端开发 开发者
微信小程序-wxss样式
微信小程序-wxss样式
133 0
|
11月前
|
Web App开发 前端开发 小程序
在网页中使用 icon 字体图标 | 前端开发
在网页中使用 icon 字体图标 | 前端开发

热门文章

最新文章