在下面的截图中，顶部的“Quick Brown Fox”是一个H1元素，底部的是一个canvas元素，文本呈现在它上面。在底部，您可以看到两个“F”并排放置和放大。注意H1元素与背景更好地混合：

这里是我用来渲染画布文本的代码：

var canvas = document.getElementById('canvas');
        if (canvas.getContext){

            var ctx = canvas.getContext('2d');
            ctx.fillStyle = 'black';
            ctx.font = '26px Arial';
            ctx.fillText('Quick Brown Fox',26);
        }

是否可以在canvas上渲染文本，使其看起来与H1元素完全相同？为什么他们不同？