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

以酷派为代表的部分安卓手机自带浏览器、微信/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. 有关java调用方法参数传递的分析

    这个问题好多文章都讲过了,在此本人补充一下,加深理解,有不足之处请指教. 相信做java开发同学们都知道,调用方法传递参数时,不论是基本类还是引用类型, java都是值传递,不存在引用传递(称引用传递 ...

  2. [转]JDBC快速入门教程

    JDBC是什么? JDBC API是一个Java API,可以访问任何类型表列数据,特别是存储在关系数据库中的数据.JDBC代表Java数据库连接. JDBC库中所包含的API任务通常与数据库使用: ...

  3. 命令行运行python项目文件，报错：ModuleNotFoundError: No module named 'xxxx' 解决办法

    在pycharm中写好了自动化测试脚本,并能在pycharm中正常运行,由于要考虑到无人值守时能自动执行,执行时就需要脱离pycharm,直接能用命令执行.但是直接用命令执行用例文件:python3 ...

  4. Intellij dea 注释行如何自动缩进?

    Intellij dea 注释行如何自动缩进?   进入 Settings -> Code Style -> Java ,在右边选择 “Code Generation” Tab,然后找到 ...

  5. MySQL通过Explain查看select语句的执行计划结果触发写操作

    [背景] 某某同学执行了一下Explain结果结果发现数据库有了一条写入操作,恭喜这位同学你的锅到货了,你签收一下: 对! 你没有听错,在一种场景下就算是Explain也会引发数据的写操作,就这是外层 ...

  6. 滴滴passport设计之道:帐号体系高可用的7条经验

    导读:应对高可用及极端峰值,每个技术团队都有自己的优秀经验,但是这些方法远没有得到体系化的讨论.高可用架构在 6 月 25 日举办了『高压下的架构演进』专题活动,进行了闭门私董会研讨及对外开放的四个专 ...

  7. nginx加载字体文件的时候报错

    nginx 下加载配置 location ~* \.(eot|ttf|ttc|otf|eot|woff|woff2|svg)$ {                root /web/static_jr ...

  8. MySql（十七）：MySql架构设计——高可用设计之思路及方案

    前言: 数据库系统是一个应用系统的核心部分,要想系统整体可用性得到保证,数据库系统就不能出现任何问题.对于一个企业级的系统来说,数据库系统的可用性尤为重要.数据库系统一旦出现问题无法提供服务,所有系统 ...

  9. 安装MySQL start Service（无法启动服务）

    在xp是这样:  C:\ProgramData\MySQL  在win7 或者win8 在C:\ProgramData\MySQL   这里还有MySQL的文件,必须要删除    注意:Applica ...

  10. 【转】10个非常有用的网页设计工具 | Goodfav Magazine

    10+ very useful Web Designer Tools Totally free legal computer eBooks download, available in various ...