标签: dingbats

我正在遇到一个奇怪的问题,显示"dingbats" html实体,特别是✔(✔).我试图显示一些复选标记,包含在一个简单的<span>:

<span style="font-family: serif; font-size: 200%">&#x2714;</span>

这在我的计算机上的Firefox 3.6,Chrome和IE8中有效,但在同事的计算机上的Firefox 4中,不显示复选标记,而是出现空白区域.奇怪的是,在同一台计算机上,复选标记在IE9和Chrome中正确显示.

我已经尝试明确指定其他字体(包括:Times New Roman,Arial,"Dingbats"),指定没有特定字体,甚至根本没有指定任何样式信息,都无济于事.我想我可以使用图像代替,但我希望能够灵活地设置角色样式,而无需每次都创建新图像.

有关如何处理此问题的任何建议？

编辑:这是这个页面(搜索hex 2714)寻找他...

IE 9:

IE 9 http://i53.tinypic.com/2ztejif.png

Firefox 4:

Firefox 4 http://i52.tinypic.com/28mol5d.jpg

我们如何更改 dingbats 的 CSS 规则？以下在 iOS Safari 中不起作用。

<span class="dingbat">&#x2716;</span>

<style>
.dingbat {
    color: blue;
    font-size: 100px;
}
</style>

下面是一个演示该问题的 JSFiddle。如果在桌面浏览器中打开 JSFiddle，dingbat X 颜色将为蓝色，大小为 100px。但是如果在手机Safari中打开，颜色会是黑色的，尺寸会偏小。

https://jsfiddle.net/ujs80tv1/2/

此问题被标记为可能与“Unicode 表情符号的颜色”重复。我不认为这个问题是重复的，因为我绝对可以在大多数浏览器中更改 Unicode dingbats 的颜色（例如，参见 JSFiddle）。我唯一无法更改颜色的浏览器是移动版 Safari。据我所知，您无法在任何浏览器中更改表情符号的颜色。

“Unicode 表情符号的颜色”问题中的推荐答案是使用新字体或库。这可能是一种解决方法，但它没有回答问题。如果有人可以证明 unicode dingbats 不能在移动 Safari 中设置样式，我会接受它作为正确答案。