Chrome 与 Firefox 渲染 unicode 字符的差异 - MathJax
我无法弄清楚为什么 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">◻</mo>
</math>
</div>
...然后我告诉 MathJax 渲染它...
MathJax.Hub.Queue(["Typeset", MathJax.Hub, "square"]);
...和 MathJax做它的事情(我无法控制 MathJax 的渲染)。所以我不太清楚问题出在哪里。
我知道这是一个非常奇怪且非常具体的问题,但我希望 Stack Overflow 社区中的某个人可能有一些想法或以前处理过 MathJax。希望一些头脑风暴能够帮助解决这个问题。
I'm having troubles figuring out why Chrome and Firefox are rendering some things differently. Below are images of a part of my project as seen in Firefox (top) and Chrome (bottom). MathJax renders everything as the page is loading and once everything has been processed and typeset, it is displayed on the page. So I'm not sure if this is my fault of MathJax's fault. Anyway here are the images...
... if you would notice, the square with black border is different in Chrome, and in a bad way. Any ideas as to why this might be happening? The following is output from Chrome's console...
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...
The code for rendering the square alone, without all the other fancy stuff, is relatively simple...
<div id="square">
<math xmlns="http://www.w3.org/1998/Math/MathML" display="block">
<mo id="tag0" class="expand">◻</mo>
</math>
</div>
... and then I tell MathJax to render it...
MathJax.Hub.Queue(["Typeset", MathJax.Hub, "square"]);
... and MathJax does its thing (I have no control over the rendering MathJax does). So I don't quite know where the problem is.
I know this is a very strange and very specific question but I'm hoping someone in the Stack Overflow community might have some idea or has dealt with MathJax previously. Hopefully some brainstorming will help resolve this issue.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
您在 Chrome 中看到的框是“缺失字符”符号。 MathJax 字体不包括 U+25FB,因此 Chrome 显示缺少的符号。看起来 Firefox 正在寻找不同字体的字符并使用它(或者也许您运行 Firefox 的计算机上有 STIX 字体,但运行 Chrome 的计算机上没有,而 MathJax 正在使用该字体)。浏览器在为 MathJax 字体中没有的符号查找替代字体的能力方面有所不同。
无论如何,请尝试使用 U+25A1 而不是 U+25FB,看看这是否更适合您。
达维德
The box you are seeing Chrome is the "missing character" symbol. The MathJax fonts don't include U+25FB, and so Chrome is showing the missing symbol. It looks like Firefox is finding the character in a different font and using that (or perhaps you have STIX fonts on the machine running Firefox but not the one running Chrome, and MathJax is using that). Browsers differ in their ability to find alternative fonts for symbols that aren't in the MathJax fonts.
In any case, try using U+25A1 instead of U+25FB and see if that works better for you.
Davide
MathML 将原生地出现在 Chrome 中,WebKit 已经为此工作了一段时间:
http://www.webkit.org/projects/mathml/index.html
我想这个问题应该被标记为 MathJax 的错误。希望很快就会有一个本地解决方案。
MathML will come to Chrome natively, WebKit has been working on it for some time now:
http://www.webkit.org/projects/mathml/index.html
I guess this question should be marked as a bug for MathJax. Hopefully soon, there would be a native solution.
我没有真正的答案,但是浏览器之间的渲染差异并不是什么新鲜事。我使用 Firefox、Chrome、Opera、IE(按顺序),通常其中一种浏览器的渲染效果比其他浏览器更好。 Firefox 有一些不错的调试插件,你可以尝试一下(Firebug???)。警告:您可能会为此花费很多精力。如果您要对 CSS 进行故障排除,哎呀:)。
I do not have a real answer, however rendering differences among browsers are nothing new. I use Firefox, Chrome, Opera, IE (in that order), quite often one of the browsers renders better than the rest. Firefox has some nice debugging plugins, you may try those (Firebug???). Warning: You may spend a lot of effort on this. If you get into troubleshooting CSS, ouch :).