- HTML 画布教程
- HTML 画布 - 主页
- HTML 画布 - 简介
- 环境设置
- HTML Canvas - 第一个应用程序
- HTML Canvas - 绘制 2D 形状
- HTML Canvas - 路径元素
- 使用路径元素的 2D 形状
- HTML 画布 - 颜色
- HTML Canvas - 添加样式
- HTML Canvas - 添加文本
- HTML Canvas - 添加图像
- HTML Canvas - 画布时钟
- HTML Canvas - 转换
- 堆肥和修剪
- HTML Canvas - 基本动画
- 高级动画
- HTML Canvas 有用的资源
- HTML Canvas - 快速指南
- HTML Canvas - 有用的资源
- HTML Canvas - 讨论
HTML 画布教程
Canvas 是一个 HTML 元素,可以使用 JavaScript 动态生成 2D 形状和位图图像。HTML Canvas 是在网页内绘制图形数据(例如图形、图表和地图)的绝佳替代方案。它是一个以位图形式更新的低级程序模型。Canvas 元素只是基本的矩形图形容器,通常使用 JavaScript 完成。Canvas 元素内的形状或任何其他图形实现都可以使用 JavaScript 完成。HTML Canvas 元素是一个类似于 div、a 或 table 的 HTML 标签,但其内容是使用 JavaScript 呈现的。
观众
本教程是为初学者创建的,旨在帮助他们了解 Canvas 元素的基础知识。完成本教程后,您将发现自己在 Canvas API 方面拥有中等水平的专业知识,从这里您可以将自己提升到更高的水平。您将能够生成各种有助于创建虚拟内容、使网页具有交互性等的图形设计。
先决条件
在继续学习本教程之前,您应该对网页及其编程语言(例如 HTML、CSS 和 JavaScript)有基本的了解。虽然这是一个初学者教程,但我们假设读者已经很好地接触了任何前端编程环境,并且了解标签、属性和元素等基本概念。我们强烈建议您在继续学习 Canvas 元素之前先了解一些 HTML 和 JavaScript 的基本知识。