fillText HTML5画布中的字体不会从默认的

Question

改变我试图做的事似乎很简单，但我无法让它正常工作。我正在尝试更改HTML5画布中绘制的元素的字体类型。我所拥有的是这样的：

function drawStaticElements(){ 
    /*Few other non text elements here*/ 

    gameScreenCtx.font = "18px Buxton Sketch"; 
    //gameScreenCtx.font = '18px Comic Sans MS'; 
    gameScreenCtx.fillStyle = "white"; 
    gameScreenCtx.fillText(gameScreenCtx.font, 5, 20); 

    gameScreenCtx.font = "18px Buxton Sketch"; 
    gameScreenCtx.fillStyle = "white"; 
    gameScreenCtx.fillText("Number of victories: "+numberOfVictories, 5, 40); 

我不知道这可能是一个浏览器版本的东西或别的东西，但在我的PC用于开发它，代码工作正常，即使上传到网络服务器。如果我尝试从另一台PC访问它，它总是默认使用相同的字体，但我尝试了一些更常见的字体，甚至连Comic Sans都没有。文本正确显示字体名称，但不会以该字体呈现。

由于发生了什么事我上传到Bitballoon网络服务器和2级不同的计算机访问它的样本，从开发计算机结果是这样的：

而且从不同的计算机结果是这样的：

上午我做错了什么吗？

Answer 1

那么，在正常情况下，计算机只能渲染安装在系统上的字体，即使如此，我想像他们的确切名称可能存在问题等等。至于“通用字体”，这些操作系统之间有所不同 - 例如，我的Linux计算机没有Comic Sans MS。

当你访问你的网站的每个用户（甚至是大部分用户）都会安装你的特定字体似乎不太可能。

在所有用户设备上实现一致外观的常见解决方案是使用CSS3 Web Fonts，它可以在加载页面之前告诉浏览器何处下载实际字体。