<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
body{background:black}
#canvas{
width: 400px;
height: 400px;
background: white;
}
</style>
<script type="text/javascript">
window.οnlοad=function(){
var ocan=document.getElementById('canvas');
var ocan1=ocan.getContext('2d');
ocan1.fillStyle = 'red';
ocan1.strokeStyle = 'blue';//边框颜色
ocan1.lineWidth = 20;//边框宽度
ocan1.lineJoin = 'round';//便捷连接点样式
// ocan1.strokeRect(50.5,50.5,50,50); 画框
ocan1.fillRect(50.5,50.5,50,50); //画形状
/*画线*/
window.οnlοad=function(){
var ocan=document.getElementById('canvas');
var ocan1=ocan.getContext('2d');
ocan1.beginPath();//声明开始画线
ocan1.moveTo(100,100)//声明起始点位置
ocan1.lineTo(200,200)//声明结束点位置
ocan1.lineTo(200,200)
ocan1.closePath();
ocan1.stroke();//连线
}
}
</script>
</head>
<body>
<canvas id="canvas">
<span>浏览器不支持canvas</span>
</canvas>
</body>
</html>
canvas
最新推荐文章于 2023-07-05 19:11:54 发布