Text 画布文本看起来很恐怖

我有以下代码来绘制文本

                ctx.fillStyle="red";
                ctx.fillRect(player.x, player.y, 10, 10);
                ctx.fillStyle="white";
                ctx.font="bold 20px sans-serif"
                ctx.fillText(player.name,player.x,player.y)

不幸的是，它看起来很可怕。真的很笨

我试着把它缩小到10px，这是红色盒子的大小，但是它看起来更糟。我做错了什么

---

画布是否有可能被CSS缩放？如果是这样的话，那会拉伸文本，因为它被写入屏幕位图而不是直接嵌入。画布是否有可能被CSS缩放？如果是这样的话，那会拉伸文本，因为它被写入屏幕位图而不是直接嵌入。您的画布大小需要在内部设置，而不是被CSS扭曲。你的画布大小需要在内部设置，不能被CSS扭曲。我在css中将高度和宽度设置为720p。这就是设置画布尺寸的方法吗？你说得对。如果我删除css并直接在html中设置宽度和高度，它看起来是正确的。我在css中将高度和宽度设置为720p。这就是设置画布尺寸的方法吗？你说得对。如果我删除css并直接在html中设置宽度和高度，它看起来是正确的。