HTML5 是一个新兴标准,具有很多新特性,特别是对图形方面增强:canvas。本质上,canvas 元素是一个白板,您可在上面 “绘制” 一些可视内容。与用各种画笔的艺术家不同,您可用不同的方法在 canvas 上作画。甚至可以在 canvas 上创建并操作动画,这不是画笔和油彩所能够实现的。

使用 HTML 标记来补充 canvas

  • 第 1 部分:首先介绍了 HTML5 中新增加的标记和页面结构,提供有关 Web 页面设计的高级信息、表单的创建、API 的使用和价值、以及 Canvas 提供的种种创新可能。
  • 第 2 部分:组织页面的输入:首先介绍了 HTML5 中新增加的,用于页面组织的标记,然后讲解了表单控件的概念,并通过一个完整的表单页面示例讲解了一些比较重要的表单控件的用法以及新增属性的意义。
  • 第 3 部分:HTML5 API 的强大功能:介绍了两个 HTML5 中重要且功能强大的 API:Geolocation 和 Web Worker,向您分别讲解了它们的功能和基本用法,并通过一个应用实例将它们组合在一起展示了其实用的价值。
  • 第 4 部分:最后的完善:本文介绍了 HTML5 Canvas 元素,并使用几个例子来演示它的功能。

推荐资源

  • 使用 HTML5 canvas 进行 Web 绘图

    HTML5 的 canvas 元素让开发人员可以使用 JavaScript 脚本语言在 canvas 中进行一系列基于命令的图形绘制操作,本文将通过讲解如何使用 canvas 元素进行基本绘图操作,以及完成简单的动画和用户交互任务,阐明 canvas 在帮助构建 Web 图形类应用时所能够提供的能力。

  • 使用 HTML5 canvas 绘制精美的图形

    本文将从最基础的内容开始,为您讲解如何在支持 HTML5 canvas 的浏览器上实现最简单的绘图功能,并通过对一些重点方法和实现效果的介绍来让您逐步了解 canvas 的强大功能。

  • 用 HTML Canvas 创建一个图片浏览器

    本文首先介绍了一些 SVG 图形的基本概念,然后讲解了如何在 HTML5 中使用 SVG,例如,实现绘制、过滤器、渐变、文本,以及将 SVG XML 添加到网页等内容。

  • Web 开发中的矢量绘图处理和应用

    本文首先阐述不同浏览器的矢量绘图解决方案,其中包括 HTML5 Canvas、SVG 以及 VML 等技术并针对每种不同的技术介绍其实现和使用方法,最后介绍如何创建一个跨浏览器的矢量绘图应用,以及对一些浏览器矢量绘图框架进行介绍。

  • 在 HTML5 2 维画布上显示 3 维效果

    视差处理以令人兴奋的方式在 Web 上使用箭头键或移动鼠标为图层添加动画效果。在本文中,我们将了解如何使用 jQuery 和 HTML5 创建一个视差环境。然后通过一个示例了解如何使用图层创建一个图形,并为其添加动画效果。