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中的内置矢量图标的更多相关文章

  1. [Learn AF3]第七章 App framework组件之Popup

    AF3的弹出对话框Popup 组件名称:Popup 是否js控件:是,$.afui.popup     说明:af3中的popup和af2中相比变化不大,依然是通过插件popup来实现的     方法 ...

  2. [Learn AF3]第五章 App Framework 3组件之Drawer——Side Menu

    Drawer——Side menu 组件名称:Drawer     说明:af3中的side menu和af2中有很大变化,af3中的side menu实际上是通过插件$.afui.drawer来实现 ...

  3. [Learn AF3]第三章 App Framework 3组件之Panel:afui的核心

    Panel,afui的核心组件 组件名称:Panel     使用说明:按照官方的说法,panel组件是af3的“核心(heart of the ui)”,panel用于构造应用中独立的内容展示区域, ...

  4. [Learn AF3]第四章 App framework组件之Button

    Button    组件名称:Button     是否js控件:否     使用说明:如果说panel组件是af3的“核心(heart of the ui)”,那么Button就是af中的五虎上将之 ...

  5. [Learn AF3]第二章 App Framework 3.0的组件View——AF3的驱动引擎

    View:af3中的驱动引擎   组件名称:View     使用说明:按照官方的说法,view组件是af3的“驱动引擎(driving force)”,view是af3应用的基础,一个app中可以包 ...

  6. [译]Intel App Framework 3.0的变化

    App Framework 3.0 原文 IAN M. (Intel) 发布于 2015-02-11  05:24 我们高兴地宣布App Framework 的新版本3.0发布了.你可以获得最新的代码 ...

  7. [Learn AF3]第一章 如何使用App Framework 3.0 构造应用程序

    af3的变化非常大.参见[译]Intel App Framework 3.0的变化 一.应用需要引用的js脚本: af3中不在自己实现dom选择器,而是选择基于jquey或兼容jquery的库如zep ...

  8. 在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 ...

  9. 简学Python第三章__函数式编程、递归、内置函数

    #cnblogs_post_body h2 { background: linear-gradient(to bottom, #18c0ff 0%,#0c7eff 100%); color: #fff ...

随机推荐

  1. jQuery 学习笔记3 点击弹出一个div并允许拖拽移动

    这里我看了下http://qings.blog.51cto.com/4857138/998878/ 的文章,感谢他的分享. 首先我们有一个a标签和一个div,div默认是不显示的,当用户点击时改为显示 ...

  2. mybatis中的.xml文件总结——mybatis的动态sql

    resultMap resultType可以指定pojo将查询结果映射为pojo,但需要pojo的属性名和sql查询的列名一致方可映射成功. 如果sql查询字段名和pojo的属性名不一致,可以通过re ...

  3. iOS import导入时没有提示的解决办法

    我认为是工程中在import时检测不到第三方类库的原因,从而import不会自动补全.在网上搜了很多,终于在stackoverflow找到了解决方法:只要把pods目录添加到用户头文件检索的路径即可. ...

  4. NLP实现文本分词+在线词云实现工具

    实现文本分词+在线词云实现工具 词云是NLP中比较简单而且效果较好的一种表达方式,说到可视化,R语言当仍不让,可见R语言︱文本挖掘——词云wordcloud2包 当然用代码写词云还是比较费劲的,网上也 ...

  5. Android Studio占用C盘内存

    使用Android Studio的时候,会发现,在各种下载导入的时候,C盘内存耗费的非常的快,于是我看了下配置.

  6. [转]oracle存储过程中update不成功的一个原因

    原文地址:http://lin49940.iteye.com/blog/466626 今天一个同事写oracle 的存储过程遇到了一个问题, 他在里面update 操作不能完成更新的操作, 但是又不会 ...

  7. Scala 中的构造器

    Scala上的从构造器也有一定的限制,Scala编程中写道. “Scala 里的每一个从构造器的第一个动作都是调用同一个类里面其他的构造器.换句话说 就是,每个 Scala 类里的每个从构造器都是以“ ...

  8. IDEA调试总结(设置断点进行调试)

    IDEA调试总结(设置断点进行调试) 黑背景版: 先编译好要调试的程序.1.设置断点

  9. Linux用户及用户组管理命令

    一,组操作 1.创建组 groupadd  test 增加一个test组 2.修改组 groupmod -n test2  test 将test组的名子改成test2  3.删除组 groupdel ...

  10. openvpn 客户端配置

    clientdev tunproto tcpremote xx.xx.xx.xx   1194resolv-retry infinitenobindpersist-keypersist-tunca c ...