標籤:style blog http java color os width 2014
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head> <title></title></head><body> <canvas id="tankMap" width="400px" height="300px" style="background-color: black"></canvas> <script type="text/javascript"> var heroX = 130; var heroY = 130; //得到畫布 var canvas1 = document.getElementById("tankMap"); //取得畫布畫筆對象 var cxt = canvas1.getContext("2d"); //畫出坦克 cxt.fillStyle = "#DED284"; //畫出左面 cxt.fillRect(heroX, heroY, 5, 30); //畫出右邊 cxt.fillRect(heroX + 15, heroY, 5, 30); //中間矩形 cxt.fillRect(heroX + 6, heroY + 5, 8, 20); //畫出坦克的蓋子 cxt.fillStyle = "#FFD972"; cxt.arc(heroX + 10, heroY + 15, 4, 0, 360, true); cxt.fill(); //車出炮線 cxt.strokeStyle = "#FFD972"; cxt.lineWidth = 1.5; cxt.beginPath(); cxt.moveTo(heroX + 10, heroY + 15); cxt.lineTo(heroX + 10, heroY); cxt.closePath(); cxt.stroke(); </script></body></html>
//如下