HTML5 Canvas像素大小是否取決於畫布大小？

Question

我畫簡單的線條與HTML5畫布：

context = $('canvas')[0].getContext('2d'); 
context.moveTo(150, 20); 
context.lineTo(300, 20); 
context.stroke(); 

當從我的畫布CSS變化：

canvas { 
    width: 500px; 
    height: 500px; 
} 

到

canvas { 
    width: 1000px; 
    height: 1000px; 
} 

筆劃的寬度和高度也增加一倍！是什麼賦予了？

Answer 1

CSS的唯一決定其可見大小。更改HTML中的width和height屬性以調整構成它的像素的實際數量。如果在HTML中它是100x100，並且在CSS 200x200中，它將被可視化地縮放2倍。

Answer 2

在這裏找到答案：Resize HTML5 canvas to fit window