此问题似乎与WINDOWS 8.1和FIREFOX V32隔离
UNICODE样本
(✔,☑,✖,)
U+237B ⍻ not check mark U+2610 ☐ ballot Box U+2611 ☑ ballot Box with check (GREEN) U+2705 ✅ white heavy check mark U+2713 ✓ check mark U+2714 ✔ heavy check mark (GREEN) U+2716 ✖ Heavy multiplication (RED)
FIREFOX V32(截图)
CHROME V37(截图)
这不是Firefox版本31中的问题
使用css颜色属性管理的其他文本.
题
>如何在所有流行的现代浏览器中管理unicode ticks的颜色?
>为什么,为什么,为什么? (我可以理解默认但是重叠设置似乎不合逻辑,我打赌这是一个移动/平板电脑补偿).
在FIREBUG中查看此帖子来源的屏幕截图
还是绿的! :○
TEST AREA
解决方法
特别是这篇文章:Gijs Kruitbosch似乎很好地总结了这个问题并提供了一个可行的工作:
This is reproducible on Nightly on Windows 8.1. AFAICT Segoe UI Emoji
is new in Windows 8,and that’s what’s causing issues here.There might be a way to turn off Windows’s coloring for the font
(apparently this exists in XAML,but perhaps only for Windows Phone,
and I don’t know if they expose that any other way),which would be
one option.The simpler option seems to be using Segoe UI Symbol instead,which
has at least all of these characters (I’m unfamiliar enough with
unicode that I don’t know if/when this is a complete substitution for
the Emoji variant of the font,and/or for what ranges).
使用Segoe UI Symbol的建议似乎有效,将示例中的CSS更改为:
div { background:#111; color:#fff; font-family: Segoe UI Symbol; }
再次导致白色蜱虫.
更新了CSS套牌示例:http://cssdeck.com/labs/dzemruoi
如果你不想在它自己的单独容器中包围tick以更改font-family,则可以将Segoe UI Symbol指定为后备,并且当其他文本将使用首选字体时,勾号仍将正确显示:
div { background:#111; color:#fff; font-family: arial,Segoe UI Symbol; }
CSS deck示例与其他文本:@L_301_5@