Chrome 与 Firefox 呈现 unicode 字符的差异 - MathJax

Question

我很难弄清楚为什么 Chrome 和 Firefox 会以不同的方式呈现某些内容。下面是我在 Firefox（顶部）和 Chrome（底部）中看到的项目的一部分的图像。 MathJax 在页面加载时呈现所有内容，一旦所有内容都已处理和排版，它就会显示在页面上。所以我不确定这是否是我对 MathJax 的错。反正这里是图片...

...如果您注意到，带有黑色边框的正方形在 Chrome 中是不同的，而且方式很糟糕。关于为什么会发生这种情况的任何想法？以下是 Chrome 控制台的输出...

Resource interpreted as font but transferred with MIME type image/svg+xml. /MathJax/fonts/HTML-CSS/TeX/svg/MathJax_Main-Regular.svg#MathJax_Main-Regular:-1
Resource interpreted as font but transferred with MIME type image/svg+xml. /MathJax/fonts/HTML-CSS/TeX/svg/MathJax_Main-Bold.svg#MathJax_Main-Bold:-1
Resource interpreted as font but transferred with MIME type image/svg+xml. /MathJax/fonts/HTML-CSS/TeX/svg/MathJax_Main-Italic.svg#MathJax_Main-Italic:-1
Resource interpreted as font but transferred with MIME type image/svg+xml. /MathJax/fonts/HTML-CSS/TeX/svg/MathJax_Math-Italic.svg#MathJax_Math-Italic:-1
etc...

单独渲染正方形的代码，没有其他花哨的东西，相对简单......

<div id="square">
   <math xmlns="http://www.w3.org/1998/Math/MathML" display="block">
     <mo id="tag0" class="expand">&#x25FB;</mo>
   </math>
</div>

...然后我告诉 MathJax 来渲染它...

MathJax.Hub.Queue(["Typeset", MathJax.Hub, "square"]);

... MathJax 做它的事情（我无法控制 MathJax 所做的渲染）。所以我不太清楚问题出在哪里。

我知道这是一个非常奇怪且非常具体的问题，但我希望 Stack Overflow 社区中的某个人可能有一些想法或之前处理过 MathJax。希望一些头脑风暴能帮助解决这个问题。

Answer 1

您在 Chrome 中看到的方框是“缺少字符”符号。 MathJax 字体不包括 U+25FB，因此 Chrome 显示缺少的符号。看起来 Firefox 正在以不同的字体查找字符并使用它（或者您可能在运行 Firefox 的机器上使用 STIX 字体，但运行 Chrome 的机器上没有，而 MathJax 正在使用该字体）。浏览器在为不在 MathJax 字体中的符号查找替代字体的能力上有所不同。

无论如何，请尝试使用 U+25A1 而不是 U+25FB，看看是否更适合您。

大卫

Answer 2

MathML 将原生支持 Chrome，WebKit 已经为此努力了一段时间： http://www.webkit.org/projects/mathml/index.html

我想这个问题应该被标记为 MathJax 的错误。希望很快会有原生解决方案。

Answer 3

我没有真正的答案，但是浏览器之间的渲染差异并不是什么新鲜事。我使用 Firefox、Chrome、Opera、IE（按此顺序），通常其中一个浏览器的渲染效果比其他浏览器好。 Firefox 有一些不错的调试插件，你可以试试那些（Firebug???）。警告：您可能会为此付出很多努力。如果你要解决 CSS 问题，哎呀 :)。