[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 ...
随机推荐
- 关于正则表达式的“\b”
今天刚刚开始看正则表达式就遇到一个十分头疼的问题,原文是这样的: “不幸的是,很多单词里包含hi这两个连续的字符,比如him,history,high等等.用hi来查找的话,这里边的hi也会被找出来. ...
- mongo源码学习(四)invariant
前言 在看MongoDB源码的时候,经常会看到这个玩意儿:invariant. invariant的字面意思是:不变式. 在emacs上跳转到函数定义要安装一个插件,ggtags,费了老大劲儿.这都可 ...
- Java并发编程:阻塞队列 <转>
在前面几篇文章中,我们讨论了同步容器(Hashtable.Vector),也讨论了并发容器(ConcurrentHashMap.CopyOnWriteArrayList),这些工具都为我们编写多线程程 ...
- Android——Android Studio导入SlidingMenu类库的方法
Android Studio导入SlidingMenu类库的方法(其他类库应该也适用) 本篇文章主要介绍了"Android Studio导入SlidingMenu类库的方法(其他类库应该 ...
- JAVA环境变量配置详解(Windows)
JAVA环境变量配置详解(Windows) JAVA环境变量JAVA_HOME.CLASSPATH.PATH设置详解 Windows下JAVA用到的环境变量主要有3个,JAVA_HOME.CLA ...
- ELK(Logstash+Elasticsearch+Kibana)的原理和详细搭建
一. Elastic Stack Elastic Stack是ELK的官方称呼,网址:https://www.elastic.co/cn/products ,其作用是“构建在开源基础之上, Elast ...
- C#中二进制和流之间的各种相互转换
一. 二进制转换成图片间的转换 1 2 3 4 5 MemoryStream ms = new MemoryStream(bytes); ms.Position = 0; Image img = Im ...
- FatJar in 创新实训 自然语言交流系统
Fat Jar Eclipse Plug-In是一个可以将Eclipse JavaProject的所有资源打包进一个可执行jar文件的小工具,可以方便的完成各种打包任务,我们经常会来打jar包,但是e ...
- 《FPGA全程进阶---实战演练》第十章 数码管实验
1基础理论部分 led数码管是由多个发光二极管封装在一起组合的“8”字型的器件,引线内部已经完成,如下图10.1所示,图10.2为实物图. 图10.1 数码管内部结构 那么我们想要控制数码管的亮灭,其 ...
- Android 中自定义控件和属性(attr.xml,declare-styleable,TypedArray)的方法和使用
一. 在res/values 文件下定义一个attrs.xml 文件.代码如下: <?xml version="1.0" encoding="utf-8" ...