今天我们将要学习在HTML5中最吸引眼球的一个标签——Canvas，我相信有很多人学习HTML5就是为了Canvas。这节内容非常简单，主要是为大家介绍Canvas标签的使用。
在我们学习它之前稍微补充一下知识，虽然有点理论，但以下稍微理论点的东西还是很有用的。
Canvas标签的基础知识：
canvas是HTML5中新增加的一个重要元素，专门用来绘制图形。在页面上放置一个canvas元素，就相当于在页面上放置了一个“画布”，如果您做过Flash，可以理解为Flash中的“舞台”，我们可以在这里面进行描绘。
必须要注意的是，我们在canvas中绘图，并不是我们拿鼠标在上面来作画。事实上canvas元素只是一块无色透明的区域（就像一个只有宽度高度无背景的div一样）需要使用JavaScript编写脚本在其中绘画。
Q：那么有些HTML5的网站，也是canvas，为什么鼠标在上面就能画画呢？
A：这是因为JS脚本捕获的鼠标的路径而作画，并非真正是鼠标来作画的，只是从视觉上感觉是鼠标来作画。就连PhotoShop我们从编程的角度来讲也不能说是鼠标在作画，而是捕获的鼠标路径和动作，程序在其绘画的。
在页面上放置一个canvas标签
一般一个基本的canvas由属性id、width和height共同组成，代码如下：
HTML怎么学习？HTML怎么入门？HTML在哪学？HTML怎么学才快？不用担心，这里为大家提供了HTML速学教程(入门课程)，有需要的小伙伴保存下载就能学习啦！
广告![ThinkPHP5快速开发企业站点[全程实录]](https://img.php.cn/upload/course/000/000/068/6253d918a3ce7278.png)
收藏
收藏
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
137
