零基础建站培训介绍

当前位置:

HTML <canvas> 标签

定义和用法

<canvas> 标签定义图形,比如图表和其他图像。
<canvas> 标签只是图形容器,您必须使用脚本来绘制图形。

实例

通过 <canvas> 元素来显示一个蓝色的长方形:

浏览器支持

IE 9、Firefox、Opera、Chrome 和 Safari 支持 <canvas> 标签。
注释:IE 8 或更早版本的 IE 浏览器不支持 <canvas> 标签。

HTML 4.01 与 HTML5之间的差异

<canvas> 标签是 HTML5 中的新标签。

提示和注释

注释:<canvas> 元素中的任意文本将会被显示在不支持 <canvas> 的浏览器中。

属性

New : HTML5 中的新属性。

属性 描述
heightNew pixels 规定画布的高度。
widthNew pixels 规定画布的宽度。

如何使用 <canvas> 标记绘图

大多数 Canvas 绘图 API 都没有定义在 <canvas> 元素本身上,而是定义在通过画布的 getContext() 方法获得的一个“绘图环境”对象上。
Canvas API 也使用了路径的表示法。但是,路径由一系列的方法调用来定义,而不是描述为字母和数字的字符串,比如调用 beginPath() 和 arc() 方法。
一旦定义了路径,其他的方法,如 fill(),都是对此路径操作。绘图环境的各种属性,比如 fillStyle,说明了这些操作如何使用。
注释:Canvas API 特别紧凑的一个原因上它没有对绘制文本提供任意支持。要把文本加入到一个 <canvas> 图形,必须要么自己绘制它再用位图图像合并它,或者在 <canvas> 上方使用 CSS 定位来覆盖 HTML 文本。

全局属性

<canvas> 标签支持 HTML 全局属性。

事件属性

<canvas> 标签支持 HTML 事件属性。

上一课: 下一课:

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注

相关教程

  • HTML常用书写工具有哪些 (115106 次浏览)
    HTML常用写书工具有以下几种:第一种:记事本记事本是最简单的HTML书写工具,但功能也是特别少的,不太适合建网站新手来使用。(新手学习HTML
  • HTML 文本格式化:使用 pre 标签对空行和空格进行控制。“计算机输出”标签:这些标签常用于显示计算机/编程代码。引用标签:使用 blockquote
  • HTML粗体标签:HTML b 标签b 标签-- 定义粗体文字 不符合标准网页设计的理念,不赞成使用. b标签是成对出现的,以<b>开始,以</b>结束 .
  • HTML换行标签:<BR/>br 是换行(Break)的缩写。文本会在这个标签的地方换行。在HTML代码里直接换行的话,按浏览器的不同可能显示为一个空格,或
  • html元素标签属性大全 (116267 次浏览)
    什么是HTML属性每个HTML元素都可以给它添加一些属性,让它成为我们做网站时需要的样子。例如一段文字,我们可以给它添加属性,使这段文字变成红色,
  • <canvas> 标签定义图形,比如图表和其他图像。<canvas> 标签只是图形容器,您必须使用脚本来绘制图形之前接触Canvas是在silverli
  • HTML <canvas> 标签 (13499 次浏览)
    定义和用法<canvas> 标签定义图形,比如图表和其他图像。<canvas> 标签只是图形容器,您必须使用脚本来绘制图形。实例通过 <canva
  • html 标签基本语法 (116764 次浏览)
    html 标签基本语法有以下几个特点:刚刚接触超文本,遇到的最大的障碍就是一些用“<”和“>”括起来的句子,我们称它为标签,是用来分割和标记