问题原因分析 #

你碰到的这个情况其实很典型：字符对应的Unicode码点是U+2F868，属于「CJK Unified Ideographs Extension B」（中日韩统一表意文字扩展区B）。旧版IE和早期Edge对这个扩展区域的字符支持非常有限——哪怕你指定了Arial Unicode MS也没用，因为这个字体的字符覆盖范围主要到U+FFFF，并没有包含Extension B区域（U+20000~U+2FFFF）的字符，这就是为什么你测试的Ⓐ（属于基本多语言平面）能正常显示，但🡨不行的核心原因。

可行解决方案 #

1. 替换为通用箭头字符（最简单高效）

如果对箭头样式没有严格的定制要求，直接换成属于基本多语言平面的通用箭头就好，这些字符几乎所有浏览器和系统字体都能完美支持：

• 普通右箭头：→（Unicode码点U+2192，HTML实体→）
• 粗体右箭头：➡（Unicode码点U+27A1，HTML实体➡）
• 空心右箭头：⇒（Unicode码点U+21D2，HTML实体⇒）

2. 使用包含该字符的Web字体

如果必须保留原箭头样式，需要引入支持U+2F868的网页字体，比如Noto Sans CJK系列、思源黑体等（这类字体覆盖了几乎所有CJK扩展区字符）。你可以下载字体文件到本地，通过@font-face引入：

@font-face {
  font-family: 'Noto Sans CJK SC';
  src: url('fonts/noto-sans-cjk-sc.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}

之后在页面中指定该字体即可：

<p style="font-family: 'Noto Sans CJK SC', sans-serif;">&#129128;</p>

注意：下载字体时要选完整版本，部分精简版字体可能会移除这类低频使用的扩展区字符。

3. 用SVG替代（兼容性拉满）

如果需要确保包括IE9及以上的所有浏览器都能正常显示，直接用SVG绘制这个箭头是最稳妥的方式，完全不依赖字体支持：

<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
  <!-- 路径可根据原箭头样式微调，这里是近似效果 -->
  <path d="M6 2L14 8L6 14V10H2V6H6V2Z" fill="#000"/>
</svg>

你可以把这段SVG直接嵌入HTML，或者保存为.svg文件通过<img>标签引用，所有主流浏览器都能正常渲染。

内容的提问来源于stack exchange，提问作者Simon Ferndriger