关于canvas设置宽高的问题

Canvas元素默认宽 300px, 高 150px, 设置其宽高可以使用如下方法: 
方法一: 
1 <canvas width="500" height="500"></canvas> 
方法二:使用HTML5 Canvas API操作 OK 
1 var canvas = document.getElementById('欲操作canvas的id'); 
2 canvas.width = 500; 
3 canvas.width = 500; 
若通过如下方法设置宽高,那么Canvas元素将由原来大小被拉伸到所设置的宽高: 
方法一:使用CSS 会被拉伸 
1 #欲操作canvas的id{ 
2     width:1000px; 
3     height:1000px; 
4 } 
方法二:使用HTML5 Canvas API操作 会被拉伸 
1 var canvas = document.getElementById('欲操作canvas的id'); 
2 canvas.style.width = "1000px"; 
3 canvas.style.height = "1000px"; 
方法三 :用jquery的$("#id").width(500);会被拉伸 

其它:canvas的width和height也不能用百分比表示。canvas会将百分值当成数值显示

猜你喜欢

转载自www.cnblogs.com/BlingSun/p/8919714.html