uView Icon 图标

简介: uView Icon 图标

基于字体的图标集,包含了大多数常见场景的图标。

#平台差异说明

App(vue) App(nvue) H5 小程序

#基本使用

注意

因为在nvue下暂时无法解决自定义图标的问题,所以此功能暂缓推出。

icon下载地址

通过<u-icon>形式来调用,设置name参数为图标名即可。其中color默认为#606266size默认为16px

<u-icon name="photo"></u-icon>

copy

#修改图标的样式

  • 通过color参数修改图标的颜色
  • 通过size参数修改图标的大小,单位为px
<u-icon name="photo" color="#2979ff" size="28"></u-icon>

copy

#图片图标

这里说的图片图标,指的是小图标,起作用定位为"icon"图标作用,而非大尺寸的图片展示场景,理论上,这个小图标应该为png格式的正方形图标。

上面说到,给组件的name参数传入一个图片的名称即可显示字体图标,这些名称中不能带有/斜杠符号,否则会被认为是传入了图片图标,同时,size参数 也被设置为这个图片图标的宽度,由于是图片,诸如颜色color等参数都会失效。

<u-icon label="uView" size="40" name="https://cdn.uviewui.com/uview/example/button.png"></u-icon>
相关文章
|
11月前
|
JavaScript 前端开发 Java
什么是深拷贝,什么是浅拷贝
什么是深拷贝,什么是浅拷贝
165 0
|
存储 Kubernetes 数据库
AWX部署
AWX部署
421 7
AWX部署
|
11月前
|
前端开发 NoSQL 安全
浅谈 前端验证码那些事
浅谈 前端验证码那些事
241 0
|
Oracle Java 关系型数据库
实时计算 Flink版产品使用合集之在同步Oracle数据时,需要下载并添加到项目中的jar包主要包括哪些
实时计算Flink版作为一种强大的流处理和批处理统一的计算框架,广泛应用于各种需要实时数据处理和分析的场景。实时计算Flink版通常结合SQL接口、DataStream API、以及与上下游数据源和存储系统的丰富连接器,提供了一套全面的解决方案,以应对各种实时计算需求。其低延迟、高吞吐、容错性强的特点,使其成为众多企业和组织实时数据处理首选的技术平台。以下是实时计算Flink版的一些典型使用合集。
180 13
|
人工智能 芯片
合肥中科深谷嵌入式项目实战——人工智能与机械臂(一)
合肥中科深谷嵌入式项目实战——人工智能与机械臂(一)
|
小程序 前端开发 JavaScript
微信小程序——解决异步问题
微信小程序——解决异步问题
653 0
uniapp使用字体图标
uniapp使用字体图标
279 1