[Learn AF3]第六章 App Framework 3.0中的内置矢量图标
AF3的内置矢量图标
介绍:要使用af3中的图标,必须首先引入icon.css,由于文件中已经内置了字体文件数据,因此不需要引入字体文件支持。
<link rel="stylesheet" type="text/css" href="js/af3.0/icons.min.css" />
使用:引入icon.css文件之后,我们就可以通过给需要显示图标的元素添加css类名来显示图标(实际上就是一个矢量字符),注意需要同时添加icon 和图标的具体类名。af3的矢量图标同时支持三种规格,正常大小、小号图标、大号图标,具体请看下面代码:
<!-- 显示正常大小的home图标 -->
<div class='icon home'>Home</div> <!-- 显示小号的home图标 -->
<div class='icon home mini'>Home</div> <!-- 显示大号的home图标 -->
<div class='icon home big'>Home</div>
AF3图标索引:由于官网没有图标的索引,特此制作了af中图标的索引图片。

第五章 App Framework 3组件之Drawer——Side Menu [Learn AF3系列]
[Learn AF3]第六章 App Framework 3.0中的内置矢量图标的更多相关文章
- [Learn AF3]第七章 App framework组件之Popup
AF3的弹出对话框Popup 组件名称:Popup 是否js控件:是,$.afui.popup 说明:af3中的popup和af2中相比变化不大,依然是通过插件popup来实现的 方法 ...
- [Learn AF3]第五章 App Framework 3组件之Drawer——Side Menu
Drawer——Side menu 组件名称:Drawer 说明:af3中的side menu和af2中有很大变化,af3中的side menu实际上是通过插件$.afui.drawer来实现 ...
- [Learn AF3]第三章 App Framework 3组件之Panel:afui的核心
Panel,afui的核心组件 组件名称:Panel 使用说明:按照官方的说法,panel组件是af3的“核心(heart of the ui)”,panel用于构造应用中独立的内容展示区域, ...
- [Learn AF3]第四章 App framework组件之Button
Button 组件名称:Button 是否js控件:否 使用说明:如果说panel组件是af3的“核心(heart of the ui)”,那么Button就是af中的五虎上将之 ...
- [Learn AF3]第二章 App Framework 3.0的组件View——AF3的驱动引擎
View:af3中的驱动引擎 组件名称:View 使用说明:按照官方的说法,view组件是af3的“驱动引擎(driving force)”,view是af3应用的基础,一个app中可以包 ...
- [译]Intel App Framework 3.0的变化
App Framework 3.0 原文 IAN M. (Intel) 发布于 2015-02-11 05:24 我们高兴地宣布App Framework 的新版本3.0发布了.你可以获得最新的代码 ...
- [Learn AF3]第一章 如何使用App Framework 3.0 构造应用程序
af3的变化非常大.参见[译]Intel App Framework 3.0的变化 一.应用需要引用的js脚本: af3中不在自己实现dom选择器,而是选择基于jquey或兼容jquery的库如zep ...
- 在Entity Framework 4.0中使用 Repository 和 Unit of Work 模式
[原文地址]Using Repository and Unit of Work patterns with Entity Framework 4.0 [原文发表日期] 16 June 09 04:08 ...
- 简学Python第三章__函数式编程、递归、内置函数
#cnblogs_post_body h2 { background: linear-gradient(to bottom, #18c0ff 0%,#0c7eff 100%); color: #fff ...
随机推荐
- BaseRecyclerViewAdapterHelper使用
Reference: https://www.jianshu.com/p/1e20f301272e 一.框架引入 先在项目的 build.gradle(Project:XXXX) 的 reposito ...
- C#学习笔记(14)——C# 使用IComparer自定义List类的排序方案
说明(2017-7-17 21:34:59): 原文:https://my.oschina.net/Tsybius2014/blog/298702?p=1 另一篇比较好的:https://wenku. ...
- phalcon无限重定向
问题 换了个新电脑,后来重新配置phalcon环境.由于用得是windows,而且还用得是2.0.5得版本,官网已经没提供这个版本下载了.而旧电脑已经被格式化了,
- 迭代器模式和组合模式(head first设计模式——8)
把迭代器模式和组合模式放在同一篇的原因是其联系比较紧密. 一.迭代器模式 1.1迭代器模式定义 迭代器模式提供一种方法顺序访问一个聚合对象中的各个元素,而不是暴露其内部的表示. 这个模式提供了一种方法 ...
- RabbitMQ安装 ubuntu12.04LTS
RabbitMQ安装需要安装较多的依赖包,之前如果安装过RabbitMQ-server必须要先彻底删除. 重装的ubuntu系统(ubuntu server)的开发环境几乎是裸的,再重新编译安装erl ...
- 【WPF】拖拽ListBox中的Item
整理了两个关于WPF拖拽ListBox中的Item的功能.项目地址 https://github.com/Guxin233/WPF-DragItemInListBox 需求一: 两个ListBox,拖 ...
- OpenWRT中的按键和灯的GPIO控制实现_转
本文转自:OpenWRT中的按键和灯的GPIO控制实现 基于BarrierBreaker版本,基于AR9331 AP121 Demo单板 来进行描述 1.灯 A.在mach-ap121.c中,定义了灯 ...
- Mask R-CNN详解和安装
Detectron是Facebook的物体检测平台,今天宣布开源,它基于Caffe2,用Python写成,这次开放的代码中就包含了Mask R-CNN的实现. 除此之外,Detectron还包含了IC ...
- SpringMVC登录拦截器
springmvc拦截器的配置.使用:1.自定义拦截器,实现HandlerInterceptor接口. package com.bybo.aca.web.interceptor; import jav ...
- Linux之查看CPU
# 总核数 = 物理CPU个数 X 每颗物理CPU的核数 # 总逻辑CPU数 = 物理CPU个数 X 每颗物理CPU的核数 X 超线程数 # 查看物理CPU个数 cat /proc/cpuinfo| ...