Twitter Bootstrap 图标和 Opera Mobile :(答案

【问题标题】：Twitter Bootstrap icons and Opera Mobile :(Twitter Bootstrap 图标和 Opera Mobile :(
【发布时间】：2014-02-14 07:42:37
【问题描述】：

为什么 Opera Mobile 浏览器中不显示 Twitter Bootstrap 的图标？怎么解决？

【问题讨论】：

什么版本的 Opera？
是的，如果您提供以下详细信息，这将有助于我们追踪问题：a) 您使用的是哪个版本的引导程序？ b) 哪个版本的歌剧？ c) 您在哪个设备上发现了这个问题？并为我们提供复制问题的演示 url，以便我们可以正确测试它。

标签： twitter-bootstrap twitter-bootstrap-3 opera opera-mini opera-mobile

【解决方案1】：

Opera Mini 一开始就不支持网络字体：

Can I use @font-face Web fonts?:

Version | Opera Mini
-------------------------------------------
Current | 5.0-7.0 [Not Supported (= Red)]

【讨论】：

【解决方案2】：

HTML 文件可以定义不同的字符集。您可以尝试使用不同的编码（例如 UTF-8）查看它。

如果字符集是 UTF-8，则未显示的字符可能来自 UTF-8 不支持的其他编码。

【讨论】：

什么是未显示的字符？你可以在这里输入吗？如果没有，你能提供一个字符代码吗？
尝试在普通浏览器中访问该页面，看看未显示的字符是什么。
Opera Mobile 不是普通浏览器？ :) 在桌面 Opera 中所有显示。
我的意思是你最喜欢的浏览器的非移动版本。没有任何圣战的意图。
在非移动版 Opera（和其他浏览器）中一切正常。

【解决方案3】：

您可能使用 CDN（内容交付网络）链接到您的引导 css 文件...如果是，那么您可能使用的是旧的过时文件。检查以确保您的链接是最新的。不使用托管依赖项的优点之一是将来不会出现这个问题。

目前，试试这个 -> //netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css

根据您对正在使用的代码的评论，您没有使用引导图标，您使用的字体很棒的图标...将其添加到您的代码中

<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.no-icons.min.css" rel="stylesheet">

<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">

应该这样做

来源 - http://fortawesome.github.io/Font-Awesome/3.2.1/icon/globe/

也是实现说明的来源

http://fortawesome.github.io/Font-Awesome/3.2.1/get-started/

【讨论】：

谢谢，但没有帮助：(
那里，试试 - 我根据你的代码调整了答案
它的问题 .icon-chevron-right:before { content: "\f054";我改变了内容：“\f054”；关于内容：“一”；和所有工作......

【解决方案4】：

您正在测试的设备可能在其内置字符集中没有该图标。每个设备都有一个可以绘制的字体集，如果您使用超出该范围的字符，它会显示一些默认图标，例如倒置的正方形或问号。

对于设备不支持 UTF8 编码中的扩展字符这一事实，您无能为力。
您可以改用受支持的字符或图像。设备的接受标头中可能有一些东西会泄露它没有所有字符。否则，您必须通过用户代理建立具有或不具有您需要的字符的设备列表，并在适用的情况下提供适当的输出。

一个可能对此有所帮助的库是 WURFL 设备数据库，它有一个名为 xhtml_preferred_charset 的功能，它是一个表示 if 的字符串

默认情况下应该支持UTF-8，但有些设备有问题。在这里您可以找到其他字符集，例如 iso8859。这个领域不提供确切的字符集，因为使用 ISO 字符集您可能需要指定您的区域之一（1、15、其他）

见http://wurfl.sourceforge.net/help_doc.php

【讨论】：