我们已经在我们的网站上使用了诸如勾号(✔)等各种符号,并注意到随着iOS 9的发布,Safari和其他浏览器已被更新为不符合颜色属性. iOS 9中的Safari和Chrome都可以找到相同的行为.
<div>test ✔</div>
div {
color: #ff0000;
-webkit-appearance: none;
}
https://jsfiddle.net/afb14b2k/1/
上述示例在其他平台(例如OS X)上显示正常.有没有一个已知的解决方法让它在iOS 9上工作？
编辑：这似乎只适用于某些标记(和符号的其他变体)的变体.在这种情况下,我们使用了很大的复选标记(U2714).当切换到常规复选标记(U2713)时,iOS没有应用任何格式,我们可以应用自定义颜色.
解决方法
在iOS 9中,U 2714 HEAVY CHECK MARK被包含在Apple的一些表情符号中.就像其他emojis一样,它被绘制为全色位图,而不是单色矢量字形,因此您无法使用CSS更改其颜色. (事实上,不能保证复选标记甚至是黑色,Other platforms画出各种不同的颜色！)
要让iOS将复选标记作为可以重新着色的常规文本绘制,您需要使用U FE0E VARIATION SELECTOR-15字符.如果您将该变体选择器字符放在✔之后,iOS将使用常规文本版本(✔︎)而不是表情符号版本(✔). OS X没有表情符号变体,所以这些看起来是一样的,但在iOS上,这些变体看起来略有不同：
在HTML中,您可以添加一个︎直接跟随你的勾号.
div {
color: red;
}
<div> ✔ without variation selector<br> ✔︎ with variation selector </div>
