html5中往矩形中贴图片
分两步:
1. 画布大小就是矩形的大小
<!DOCTYPE HTML><html><head><title>HTML5 Canvas Sample</title> <script> var IMG_SRC = "./1.jpg"; function drawRect() { var canvas = document.getElementById("canvas"); var context = canvas.getContext("2d"); //context.strokeRect(50, 50, 120, 120); var img=new Image(); //图像被装入后触发 img.onload=function(){ context.drawImage(img,0,0); } img.src=IMG_SRC; } </script></head><body onload="drawRect();"> <canvas id="canvas" width="100" height="500"> aaa </canvas> <canvas id="canvas1" width="500" height="500"> bbb </canvas></body></html>