HTML unicode箭头适用于Safari桌面,但不适用于iOS版Safari

时间:2013-12-27 17:00:48

标签: html ios css unicode safari

我正在使用页面上的❯箭头,它在OS X上的Chrome,Firefox和Safari上正常渲染,但在iOS(iPhone)上的Safari中,箭头呈现为空框(你知道,“无法”渲染“盒子”。

关于为什么会发生这种情况的任何想法以及我可以采取哪些措施来解决这个问题?谢谢!

编辑:

实际上,如果有人能提供更好的解决方案(虽然我意识到这可能不可能),我会非常感激... ...我不想@ font-face或@import one,不值得增加压力关于三个箭头的资源...是否有可以与iOS的Safari一起工作的箭头unicode,有人可以链接我?也许是画廊?

4 个答案:

答案 0 :(得分:20)

将字体设置为' Zapf Dingbats'它将在iOS中运行。

font-family: 'Zapf Dingbats';

答案 1 :(得分:8)

“BLACK RIGHT-POINTING TRIANGLE”字符的十六进制索引为U+FE0F。它有两种样式变体,text和emoji,可以通过添加一个称为“变体选择器”的尾随unicode字符来明确指定。这些变体选择器的十六进制索引为Variation | HTML | CSS ----------- | ---------------- | ------------ unspecified | `&#x25b6;` | `\25b6` text | `&#x25b6;&#xfe0e;` | `\25b6\fe0e` emoji | `&#x25b6;&#xfe0f;` | `\25b6\fe0f` (文本)和<span>Next &#x25b6;&#xfe0e;</span> (表情符号)。

我认为最好指定你希望呈现的变体,因为如果未指定,iOS将默认为表情符号变体。

<style>
  .next-label:after{
    content:'\25b6\fe0e';
  }
</style>
<span class="next-label">Next</span>

e.g。

FE0E

FE0F

注意:{{1}}和{{1}}包含,而不是字母'o'。

答案 2 :(得分:5)

显然,iOS上的字体中不存在字符“❯”(这不是箭头,而是丁字符字符U + 276F重点正确的引号引号)。选项是(合理顺序):使用不同的字符,或使用图像,或使用嵌入字体。

答案 3 :(得分:0)

字体Cabin Condensed(重量600)的结束克拉(&gt;),与unicode arrow“&amp;。#1.0.0.9.5。;”完全相同。 (❯)。

谷歌字体免费!

...因为它是一种字体,所以它适用于所有设备和浏览器。