Mac Safari HTML 中的神秘 X 符号答案

【问题标题】：Mysterious X symbol in Mac Safari HTMLMac Safari HTML 中的神秘 X 符号
【发布时间】：2014-06-16 14:41:35
【问题描述】：

我正在建立一个网站，并注意到这个神秘符号，只有在使用 Safari 时才会在 Mac 上弹出。该元素位于 h2 标签内。附图显示了一个奇怪的红色圆圈中的神秘符号

下面是html。

   <div class="top-black" id="pre-baserate-top">
       <img class="specs-r-img" src="/ui/3_tvs_icon_244x90.png" alt="3tv icons"/>
       <div class="title-container white-title">
            <h1>YOU’VE UNCOVERED 3 RESULTS</h1>
            <h2>The Good, The Bad, and The Better‏</h2>
       </div>
   </div>

下面是 CSS

.top-black{
  background-color: black;
  width: 100%;
  img{
   margin:0 auto;
   padding-top:2%

  }
  .white-title{
    color:white;
    margin:0;
    h2{
      margin:0;
    }
}

请帮忙！

【问题讨论】：

您使用的字体系列是什么？
是纯 CSS 还是一些手写笔/sass/etc？
@rubo123 导入网址(fonts.googleapis.com/…);

标签： html css macos safari

【解决方案1】：

h2元素的内容末尾，有U+200F RIGHT-TO-LEFT MARK，一个不可见的控制字符，指定其余内容以从右到左为基本写法方向。它在这种情况下应该没有效果，但显然 Mac Safari 无法正确处理它，而是尝试将其呈现为图形字符；方框中的 X 表示尝试渲染当前使用的字体中不可用的字符。

当然，解决方案是删除该字符。例如，在一个简单的文本编辑器中，将光标放在</h2> 中的< 之前，然后按删除键（通常标有←）。

提示：为了检查发生了什么，我将问题中的标记复制到 BabelPad 编辑器中，当您移动光标时，您可以在其中看到 Unicode 数字和字符名称。

【讨论】：