关于部分奇葩用户代理不显示字体图标

以酷派为代表的部分安卓手机自带浏览器、微信/QQ WebView 等用户代理无法正常显示 Icon Font,原因可能是这些用户代理无法正确处理伪元素 content 的五位数的 Icon Font 十六进制编码,详情参考 Iconfont 在移动端遇到问题的探讨,可以通过这个页面进行测试。

解决方式有两种:

  • 将 Icon Font 编码限制在 4 位:Amaze UI 直接使用 Font Awesome,不可能去调整近 500 个图标的编码。
  • 将 Icon Font 的编码直接以内容的形式写进 HTML。

http://www.cnblogs.com/ljack/p/3751678.html

http://amazeui.org/css/icon

https://github.com/allmobilize/amazeui/issues/277

Iconfont在移动端应用的问题的更多相关文章

  1. Iconfont在移动端遇到问题的探讨

    Iconfont越来越得到前端的关注,特别是阿里那个iconfont库的推出和不断完善,再加上连IE6都能兼容,的确是个好东西. 既然那么火,我们公司移动项目也计划加入这个iconfont,于是我就针 ...

  2. amazeui学习笔记--css(常用组件6)--图标Icon

    amazeui学习笔记--css(常用组件6)--图标Icon 一.总结 1.关注用法即可:在 HTML 上添加添加 am-icon-{图标名称} class. <span class=&quo ...

  3. 如何使用IconFont字体图标代替网页图片?

    一.IconFont的优点 1.轻量性 可以减少http请求,可以配合html5离线存储做性能优化,有利于后期维护. 2.灵活性 可以自由变换IconFont大小(不失真),可以修改IconFont颜 ...

  4. 图标字体(IconFont)制作

    图标字体(IconFont)介绍 图标字体(IconFont)现在越来越被广泛使用,大大提高了网页的多样化,解决了视网膜屏幕失真的问题. 据说微软从IE4开始支持的这个私有方法(@font-face) ...

  5. icon-font与svg

    icon font 使用与svg应用分享 icon font 字体概述 css3增加了@font-face属性,传统的浏览器是通过font-family来设置字体,如果系统里没有的话就用其它字体来代替 ...

  6. fontcreator制作iconfont(包含两个教程)

    第一步 在AI中画好矢量图,或者是在PS中将纯色的图片存成PNG格式,最好是放大很多倍的纯色图片.因为导入到fontcreator中会显得很小,如果不是矢量,图片拉大后就会有锯齿状. 第二步 选中AI ...

  7. HTML5移动端图片上传模块

    上传图片的功能是极为常用的,之前做过一个移动端上传文件的功能(基于jquery的),总结梳理一下. html <div class="uploadPic clearBox"& ...

  8. HTML5前端(移动端网站)性能优化指南

    HTML5是一种最新发布网页构架的普遍模型,是构建对程序.对用户都更有价值的数据驱动的Web的前端技术框架,它的价值在于融合CSS/javaScript/flash等众多前端开发技术,更多的体现在对交 ...

  9. 移动端HTML5开发心得(转)

    1. iOS里fixed中有input或者textarea,用户在里面输入文字,触发键盘,fixed容器会居中显示,而不是继续悬浮       解决办法: http://dwz.cn/CrwNz 2. ...

随机推荐

  1. Python 文件 writelines() 方法

    概述 Python 文件 writelines() 方法用于向文件中写入一序列的字符串. 这一序列字符串可以是由迭代对象产生的,如一个字符串列表. 换行需要制定换行符 \n. 语法 writeline ...

  2. Koa 框架 的错误处理

    默认情况下Koa会将所有错误信息输出到 stderr,除非 NODE_ENV 是 "test".为了实现自定义错误处理逻辑(比如 centralized logging),您可以添 ...

  3. InlineModelAdmin对象的学习

    一.InlineModelAdmin的介绍 管理界面可以在与父模型相同的页面上编辑模型.这些被称为内联. Django提供了两个子类,InlineModelAdmin它们是: TabularInlin ...

  4. kail-linux下安装pycharm

    1.下载pycharm pycharm官网下载链接:https://www.jetbrains.com/pycharm/download/#section=linux 请注意下载对应系统的profes ...

  5. Java使用Rabbitmq惊喜队列queue和消息内容的本地持久化核心方法。(内容存储在硬盘)

    _Channel.queueDeclare(queue, true, false, false, null); _Channel.basicPublish(_ExchangeName, queue,M ...

  6. Recyclerview 出现 java.lang.IndexOutOfBoundsException: Inconsistency detected 异常

    使用 RecyclerView 的时候报错 java.lang.IndexOutOfBoundsException: Inconsistency detected. Invalid view hold ...

  7. Filberder教程

    http://www.cnblogs.com/TankXiao/archive/2012/02/06/2337728.html

  8. 【Unity】7.4 游戏外设输入

    分类:Unity.C#.VS2015 创建日期:2016-04-21 一.简介 Unity可以处理摇杆.游戏手柄.方向盘等标准游戏外设的输入,使用的方法如下图所示: 虚拟按键需要在输入管理器中配置,把 ...

  9. Cowboy实例

    这个例子主要是用cocos2d-x引擎自带的资源 cocos2d-x-2.2.2\samples\Cpp\TestCpp\Resources\armature 新建工程之后 #include &quo ...

  10. Swift中Notification.Name这么难用怎么办

    Swift中Notification.Name这么难用怎么办 以前的发送通知的参数就是一个简单的字符串: NSNotificationCenter.defaultCenter().post(" ...