HTML5 Canvas TextBaseline Top 在 Firefox 和 chrome 中看起来不同答案

【问题标题】：HTML5 Canvas TextBaseline Top looks different in Firefox and chromeHTML5 Canvas TextBaseline Top 在 Firefox 和 chrome 中看起来不同
【发布时间】：2016-05-26 06:13:59
【问题描述】：

在画布中，将 textBaseline 属性设置为“top”时，其在 chrome 和 firefox 中的呈现方式不同。在 chrome 中，行和文本之间存在间隙，而在 firefox 中没有间隙。

请参考this 在您的浏览器中查看，任何帮助将不胜感激。

我还检查了similar issue 报告的长背。 Firefox 中是否有任何解决方法可以使其正常工作？

【问题讨论】：

使用字母并手动设置偏移量或通过FF的来源修复错误。
其实这个bug似乎在其他浏览器中：bugzilla.mozilla.org/show_bug.cgi?id=737852#c20

标签： javascript google-chrome firefox canvas html5-canvas

【解决方案1】：

我同意 OP 的观点，即这是一个问题，并且是 Firefox 所特有的。不过，Firefox 似乎越来越多地调整了垂直偏移量。曾经是大约 4 个像素，然后是 3 个像素。现在，几乎无法察觉。所以，我同意上面的@Kaiido。使用/设置*object*.textBaseline="alphabetic"; 我相信这在浏览器之间是一致的。

【讨论】：