HTML5入门学习教程
HTML5什么是HTML5在W3C HTML5的常见问题中，HTML5解释了这一点：HTML5是在开放平台下开发的免费许可条款。
具体来说，对这个句子有两种理解：
Ldquo；
它指的是一组技术，构成未来开放的网络平台。这些技术包括HTML5规范，CSS3，SVG，MATHML，地理位置优越，XmlHttpRequest，背景的2D，Web字体，以及其他的技术。这套技术的边界是非正式的和随时间的变化。
HTML5规范当然是开放网络平台的一部分。
画布浏览器支持
我列出了最流行的Web浏览器，以及它们开始支持的画布元素的最小版本。
游猎
火狐
IE
铬
娥佩兰
iOS的Safari
Android的浏览器
三点二
三点五
九
九
十点六
三点二
二点一
我建议在这里使用Chrome。
简单的HTML5页面
xml代码将内容复制到剪贴板。
基本HTML5页面
你好播出！
示范的结果如下：
HTML是由一个形状组成的，比如括弧标签元素组合，这些标签通常成对，不能交叉嵌套标签。
延伸：
一对的外观被称为封闭标签，一个外观被称为一个单一的标签。无论如何，它是封闭的（单个标签不能关闭，但在XHTML中严格要求）。封闭的标签也分为起始标签和结束标签，如起始标签和结束标签。自标记，例如，等等。
更多的标签，我们建议你知道yourself.w3school平台推荐自学。
在这里，我们将集中于上面代码中出现的标签。
xml代码将内容复制到剪贴板。
这个标签表明，Web浏览器将在标准模式的页面。根据W3C定义的HTML5规范，这是HTML5文档的必要。这个标签简化了，一直在不同的浏览器的HTML页面显示奇怪的差异。它通常是在文件的第一行。
xml代码将内容复制到剪贴板。
这是一个标签，包含语言的指令，例如，恩是英语，ZH是中国。
xml代码将内容复制到剪贴板。
…
这2个标签分别代表标题信息的开头和结尾，标题中包含的标签是页面的标题、前言和描述，它本身不显示为内容，但影响页面显示的效果。
下表列出了HTML头部元素下的所有标记和函数：
标签
描述
文档的信息被定义。
定义文档的标题。
定义页面链接标签的默认链接地址。
文档和外部资源之间的关系被定义。
定义了html文档中的元数据。
定义了客户端的脚本文件。
定义HTML文档的样式文件。
xml代码将内容复制到剪贴板。
这个标签描述的字符编码方式使用Web浏览器，这是通常设置为utf-8.if不需要特殊的设置，也没有必要去改变它。这也是HTML5页面需要的元素。
xml代码将内容复制到剪贴板。
…
这个标签描述了在浏览器窗口中显示的HTML的标题，这是一个非常重要的标记，它是搜索引擎用来在HTML页面上包含内容的主要信息之一。
xml代码将内容复制到剪贴板。
…
页面的实际内容包含在2个页面之间。
总之，HTML5的网页是由第一行的一部分，它主要分为两部分：mdash；mdash；由标签和规定的主要部分指定的头部。
通过这种方式，我们简化了最简单的HTML网页的基本结构。
添加一个帆布
在HTML中添加画布非常简单。只需在HTML的一部分添加一个标签。
xml代码将内容复制到剪贴板。
基本HTML5页面
你的浏览器不支持画布让我们换一个！
因为结果页面是一个完整的空白页面，我不在这里。你可能好奇，为什么它是空白的（废话，我还没来得及画）画布的意思是画布，也就是画布的意思（废话），画布在HTML5中是透明的，是不可见的。
那个标签里的文字是什么意思也就是说，一旦浏览器执行HTML页面，它就不支持画布。它将显示文本。换句话说，只要浏览器支持画布，文本就不会显示在页面上。
这是什么意思id是标签的属性之一，它用于在Javaｓｃｒｉｐｔ代码中指定一个特定的名称，就像一个人的ID号一样，这是唯一的。
为了更清晰地显示画布和演示的方便，我稍微修改了代码，随后的绘图将在画布上绘制。
xml代码将内容复制到剪贴板。
基本的帆布
你的浏览器不支持画布让我们换一个！
运行结果：
上面的代码有好几条说明：
1。添加了一个标签，它将被包装，个人习惯，暂时没有鸡蛋。
2。指定标签的宽度和高度属性，指定其宽度和高度。
三.将内联样式添加到标签中，将其转换为块级元素，并将其显示在中间。
CSS的内容没有任何解释。毕竟，这不是这门课的主要特点。如果扩展，它将占用很多空间。
引用画布元素
文档对象模型（DOM）
文档对象模型（DOM）是用于处理可扩展标记语言，由W3C组织推荐的标准编程接口，文档对象模型的历史可以追溯到上世纪90年代末，微软和网景的浏览器大战；；为了在Javaｓｃｒｉｐｔ和Jｓｃｒｉｐｔ生存，双方都提出了浏览器上规模一个强大的功能，微软增加了很多独家的东西的网页技术，包括VBｓｃｒｉｐｔ、ActiveX和微软自己的DHTML格式。许多网页不能通过非微软平台和浏览器来显示。
文档对象模型表示HTML页面上的所有对象，它是中立的和平台中立的，它允许在Web浏览器呈现后再次更新页面的内容和样式。用户可以通过Javaｓｃｒｉｐｔ访问DOM。
在开始之前，首先需要知道两个特定的DOM对象：窗口和文档。
窗口对象是DOM的最高级别。在启动画布应用程序之前，必须检测该对象，确保所有资源和代码都已加载。
文档对象包含HTML页面上的所有HTML标记。需要检索这个对象以找到使用Javaｓｃｒｉｐｔ操作的实例。
Javaｓｃｒｉｐｔ的放置位置
使用javaｓｃｒｉｐｔ进行画布编程会产生一个问题：在创建的页面中启动Javaｓｃｒｉｐｔ程序
把Javaｓｃｒｉｐｔ放在HTML页面的标签中是个好主意。这样做的好处是，很容易找到它，它也在最后一章提到的。然而，把Javaｓｃｒｉｐｔ程序这意味着整个HTML页面必须加载JAVASCRPIT运行HTML。在整个页面加载之前，Javaｓｃｒｉｐｔ代码也将被执行。因此，在运行Javaｓｃｒｉｐｔ程序之前，必须检查HTML页面是否已经加载。
最近的一个趋势是将Javaｓｃｒｉｐｔ放在HTML文档的结尾的标记上，这样可以确保在Javaｓｃｒｉｐｔ运行时加载整个页面。
但我不走寻常路（笑声），所以以后的情况下，还是按照自己的编码风格把javaｓｃｒｉｐｔ代码放在尾部。当然，如果有很多javaｓｃｒｉｐｔ代码的话，建议使用的方式是外部的js文件被加载：
Javaｓｃｒｉｐｔ代码将内容复制到剪贴板。
在实际的项目开发中，所有的HTML、CSS、js三都是完全分离的，但是案例演示代码稍微少一些，所以大多数方法都不用于加载外部js文件。
获取画布对象
获取画布对象实际上是一个句子。
Javaｓｃｒｉｐｔ代码将内容复制到剪贴板。
VaR的画布document.getelementbyid（画布）；
VaR是用于定义变量，因为Javaｓｃｒｉｐｔ是弱类型语言，所以什么变量与变种VaR的帆布定义以下变量。使用getElementById（）通过ID。之前我们给标签的ID叫帆布得到对象的文档对象的方法，所以最后的帆布是idmdash；mdash；帆布。（是它周围，一点点你要读过几遍。）
获取画笔（2D环境）
你首先需要什么刷，刷的帆布也是同样的事情，那就是使用getContext（2D）的画布对象你刚刚获得的方法。
Javaｓｃｒｉｐｔ代码将内容复制到剪贴板。
VaR上下文= canvas.getcontext（2D）；
上下文是画笔。
在所有其他的教程，在二维环境中使用是一个专有名词，我想刷更形象。灵感来自G刷java图形类型，原理是一样的。
总结
筹备工作只有三个步骤：
1。布局画布：添加标签以添加画布元素
2。获取画布：通过标签ID获取画布对象
三.有刷：通过getContext获得二维环境（2D）的画布对象的方法
相应的代码是三个句子。
Javaｓｃｒｉｐｔ代码将内容复制到剪贴板。
VaR的画布document.getelementbyid（画布）；
VaR上下文= canvas.getcontext（2D）；
完整的代码如下所示。
Javaｓｃｒｉｐｔ代码将内容复制到剪贴板。
基本的帆布
你的浏览器不支持画布让我们换一个！
在window.onload =函数（）{
VaR的画布document.getelementbyid（画布）；
VaR上下文= canvas.getcontext（2D）；
}
注意几点：
的1.javaｓｃｒｉｐｔ代码需要用标签。
2.window.onload =函数（）{ }加载页面后会立即执行，说，加载后后面的内容执行函数体。
此时，画布和画笔已经准备好，然后让我们使用画笔（上下文对象）绘制一个高压力的图像！醒来！艺术家的灵魂！