canvas是一个强大的绘图及制作动画和游戏手段,下面介绍canvas利用js的API实现基本画图功能。
划线:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
*{
margin: 0;
padding: 0;
}
html,body{
width: 100%;
height: 100%;
overflow: hidden;
}
</style>
</head>
<body>
<canvas id="can"></canvas>
<script>
//获取canvas元素
var can=document.getElementById("can");
//动态的设置宽和高
//获取屏幕的可视区域宽高
var window_w=document.documentElement.clientWidth;
var window_h=document.documentElement.clientHeight;
can.width=window_w;
can.height=window_h;
//操作canvas
//转化为2d模式
var content=can.getContext("2d");
//使用js提供的API去绘制