javascript - 无法在 Firefox 画布中绘制斜体文本

Question

在画布中绘制斜体文本时，Firefox 会将它们呈现为正常的字体，如Impact.

var ctx = canvas.getContext('2d');
ctx.font = "italic 40px Impact";
ctx.fillText("Impact", 0, 40);

在 jsFiddle 上查看

火狐

铬合金

任何想法如何解决这个问题？

Answer 1

这是因为 Impact 没有斜体版本。当您在字体查看器（如 Mac Font Book）中查看它时，您可以看到这一点。浏览器在没有斜体的字体上伪造斜体，但 Firefox 还没有在画布中伪造它。如果您尝试使用带有斜体的字体，例如 Arial，它可以在画布中使用。

这里有一些讨论：Italic doesn't work on all fonts in Firefox

演示：

ctx.font = "italic 40px Arial";