Safari mobile不尊重HTML实体的CSS颜色属性✖

Question

Safari mobile不尊重HTML实体的CSS颜色属性✖

有点混乱,颜色属性在Safari的桌面版本上受到尊重,但在移动设备上却没有.

我在iPhone 5(iOS版本9.2.1)上测试了它.

示例代码(第一个跨度在safari mobile上显示为黑色):

 <html>
   <head>
      <style>
         span { color: white; }
      </style>
   </head>
   <body>
      <span>&#10006;</span>
      <span>&times;</span>
      <span>×</span>
   </body>
 </html>

Run Code Online (Sandbox Code Playgroud)

和JSFiddle链接:https://jsfiddle.net/9t3v8846/

添加!important没有做任何事情.可能导致这种情况的任何想法？

Answer 1

mik*_*z_8 23

如果有任何可怜的人遇到这个......修复此问题的方法是在实体之后添加变体选择器,如下所示:

<span>✖︎</span>

基本上,幕后的内容是浏览器决定如何呈现HTML实体.

iOS上的Safari更喜欢尽可能使用类似表情符号的渲染,因此忽略了CSS属性.上面使用的变体选择器指定我们想要使用类似文本的渲染,使Safari现在尊重应用于它的任何颜色属性.

归档时间：	10 年，3 月前
查看次数：	2074 次
最近记录：	10 年，2 月前

Safari mobile不尊重HTML实体的CSS颜色属性&#10006;

Safari mobile不尊重HTML实体的CSS颜色属性✖