直接缩放画布VS在HiDPI中缩放CSS

时间:2014-03-07 14:36:49

标签: google-chrome canvas safari webkit retina-display

抱歉,我是初学者,有时候我发现有人说我只需要缩放CSS,而其他例子我发现他们直接将这个尺寸乘以新尺度,换句话说canvas.width VS canvas.style.width

有什么区别?

最新的Chrome是否像Safari一样(现在是2014年3月)?

1 个答案:

答案 0 :(得分:1)

Canvas由两部分组成:元素画布,这是您在屏幕上看到的。然后在场景的“后面”排列你绘制的图像位图。

设置element.style只会影响元素本身,但不会影响场景(内部)位图。只需拉伸此位图以适合元素大小(如图像)。如果未指定大小,则默认为300 x 150像素。

widthheight属性(或标记的属性)是设置内部位图大小的属性。

没有CSS的元素通常采用内部位图的大小(这里涉及像素长宽比,但通常关系是1:1)。

但是,您可以通过设置元素的CSS大小来覆盖它。同样,它不会影响内部位图,只是将其拉伸以适合元素。

所有浏览器都应该表现相同。