評等結果
點擊便能為這篇文章進行評等!
[評等總次數: 0,平均評等: 0]
<!DOCTYPE HTML><!-- HTML5 宣告 很重要別漏掉-->
<html>
<head>
<style>
body {
margin: 10px;
padding: 0px;
}
</style>
</head>
<body>
<canvas id="canvas1" width="500" height="500" style="border:1px solid #000000;"></canvas>
<!-- 建立一張 500 x 500 的畫布 加上邊框 以利確認位置及比例 -->
<script>
var canvas = document.getElementById('canvas1');
var context = canvas.getContext('2d');
context.beginPath();//開始繪製
context.strokeStyle = '#ff0000';//設定線條顏色 預設為 黑色
context.lineWidth = 0.5;//設定線條寬度 預設為 1
context.lineCap = 'square';//設定線頭格式 square / round / butt 預設值為square
//畫一條垂直的線
context.moveTo(250, 0);//移到那一個坐標點 (X,Y)
context.lineTo(250, 500);//從x點到y點
//畫一條水平的線
context.moveTo(0, 250);
context.lineTo(500, 250);
context.stroke();//繪製邊線
//此範例是在中間畫一個十字交插
</script>
</body>
</html>
評等結果
點擊便能為這篇文章進行評等!
[評等總次數: 0,平均評等: 0]