canvas教程

Canvas 教程

字号+ 作者:H5之家 来源:H5之家 2015-09-07 19:18 我要评论( )

Canvas 教程 canvas 是一种可以通过编写脚本(通常是)来实现绘制图形的HTML元素。例如,它能用来绘制图形,制作组合图像或者生成简单的 (偶尔 也不简单) 动画。右边的图像展示了canvas实现的一些例子,在接下来的教程中我们将会实现它们。 canvas第一次出现

Canvas 教程

 

<canvas> 是一种可以通过编写脚本(通常是)来实现绘制图形的HTML元素。例如,它能用来绘制图形,制作组合图像或者生成简单的 (偶尔 也不简单) 动画。右边的图像展示了<canvas>实现的一些例子,在接下来的教程中我们将会实现它们。

<canvas>第一次出现是被苹果在Mac OS X仪表盘中实现,之后就被应用到Safari和谷歌Chrome中。Gecko1.8及以上的浏览器,比如火狐1.5,同样也支持这个元素。<canvas>标签是WhatWG Web applications 1.0标准化即HTML5的一部分。本教程从基础入手,讲述了如何使用<canvas>标签来绘制2D图像。提供的例子应该会使你了解你能够通过canvas做到的事情并且将会提供一些帮助你开始建立自己的内容的代码片段。

 

在你开始之前

使用<canvas>元素并没有你想象的那么难,但是你仍然需要对HTML和有 一定的了解。<canvas>元素在某些过旧的浏览器中是不被支持的,但是所有主流浏览器的最新版本都已经支持了该元素。canvas的默认 大小是300像素*150像素(宽*高)。但是可以通过使用CSS宽高属性来自定义其大小。为了在canvas中绘制图像我们会使用一个 javascript内容对象(javascript context object这应该如何翻译),它将会创建一个动态图像。

 

教程内容 相关资料

posted @

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • fd详细教程|Excel_VBA_详细教程

    fd详细教程|Excel_VBA_详细教程

    2017-05-02 18:01

  • html5canvas核心技术图形、动画与游戏开发源码

    html5canvas核心技术图形、动画与游戏开发源码

    2017-05-02 17:42

  • 打印html5中Canvas的方法

    打印html5中Canvas的方法

    2017-05-01 15:03

  • SketchBook 2014 基础入门视频教程

    SketchBook 2014 基础入门视频教程

    2017-05-01 11:00

网友点评