HTML5 canvas相关

Question

给canvas用css设置高和宽后会出问题（（100,100）的位置不是中点）：
<canvas id="canvas" style="width:400px;height:400px;"></canvas>
   
<script type="text/javascript">
var canvas=document.getElementById('canvas');
var context=canvas.getContext('2d');

context.moveTo(0,0);
context.lineTo(100,100);

context.strokeStyle='#ff0';


context.stroke();
</script>
而不设置高和宽，或者用html的方式设置宽和高就正常了：
<canvas id="canvas" width="400px" height="400px"></canvas>

Answer 1

楼主 参考下 http://www.189works.com/article-44786-1.htmlhttp://topic.csdn.net/u/20090104/10/520825ed-97f9-42d1-8e26-9bcd2b134a3a.html

Answer 2

<canvas id="canvas" width="400" height="400px;"></canvas>

Answer 3

<canvas id="canvas" width="400" height="400"></canvas>

Answer 4

http://www.cnblogs.com/artwl/archive/2012/02/28/2372042.html在canvas中定义width、height跟在style中定义width和height是不同的，canvas标签的width和height是画布实际宽度和高度，绘制的图形都是在这个上面。而style的width和height是canvas在浏览器中被渲染的高度和宽度。如果canvas的width和height没指定或值不正确，就被设置成默认值(width:300px，height:150px)。