手机
当前位置:查字典教程网 >网页设计 >HTML5教程 >canvas需要在标签里直接定义宽高
canvas需要在标签里直接定义宽高
摘要:以前用canvas画图时,都是直接在canvas标签里直接写上宽高,没有问题,但也没有探究过为什么宽高要直接写在canvas标签里,因为各个...

 以前用canvas画图时,都是直接在canvas标签里直接写上宽高,没有问题,但也没有探究过为什么宽高要直接写在canvas标签里,因为各个资料的例子上都是这么写的。今天王sir提出了一个问题:如果把宽高写在<style>里,看看会有什么不同。自己试了以下,果然有问题。

先看一下代码:
代码如下:


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>canvas</title>
<meta name="Keywords" content="">
<meta name="author" content="@my_programmer">
<style type="text/css">
body{margin:0;}
canvas{margin:20px;
/*width: 400px;
height: 300px;*/
}
</style>
</head>
<body onload="draw()">
<canvas id="canvas" width=400 height=300 style="border:1px solid #f00;"></canvas>
<script>
function draw() {
var canvas=document.getElementById('canvas');
var context=canvas.getContext('2d');
context.beginPath();
context.moveTo(20,20);
context.lineTo(200,100);
context.lineWidth=5;
context.stroke();
}
</script>
</body>
</html>

【canvas需要在标签里直接定义宽高】相关文章:

HTML5 Canvas标签使用收录

如何在网站上添加谷歌定位信息

全面解析HTML5中的标准属性与自定义属性

HTML5 Canvas自定义圆角矩形与虚线示例代码

HTML5 canvas基本绘图之图形组合

HTML5 Canvas绘制圆点虚线实例

HTML5 对各个标签的定义与规定:title

HTML5 对各个标签的定义与规定:link

a标签下载链接的简单实现

HTML5所有标签汇总及标签意义解释

精品推荐
分类导航