var canv = document.getElementById('myCanvas');
var context = canv.getContext('2d');
context.fillStyle = "#ff0000";
context.fillRect(0, 0, 100, 100);
上面代码显示正常效果如下:
但是如果把 canvas的样式放在head中,结果运行效果如下图所示(画布并不是100*100的尺寸,这就是我疑问的地方),
后者效果的代码如下:
#myCanvas{
width:300px;
height:200px;
border:1px solid blue;
}
var canv = document.getElementById('myCanvas');
var context = canv.getContext('2d');
context.fillStyle = "#ff0000";
context.fillRect(0, 0, 100, 100);