• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >html5 > HTML5 Canvas入门学习教程

HTML5 Canvas入门学习教程

作者:Airing 字体:[增加 减小] 来源:互联网 时间:2017-08-06

本文主要包含HTML5,Canvas等相关知识,Airing 希望在学习及工作中可以帮助到您

HTML5

究竟什么是HTML5?在W3C HTML5的常见问题中,关于HTML5是这样说明的:HTML5是一个开放的平台下开发的免费许可条款。
具体来说,对这句话有以下两种理解:
“
指一组共同构成了未来开放式网络平台的技术。这些技术包括HTML5规范、CSS3、SVG、MATHML、地理位置、XmlHttpRequest、Context 2D、Web字体以及其他技术。这一套技术的边界是非正式的,且随时间变化的。
指HTML5规范,当然也是开放式网络平台的一部分。

”
Canvas的浏览器支持
以下我列出了最流行的Web浏览器以及它们开始支持Canvas元素的最小版本号。

Safari Firefox IE Chrome Opear iOS Safari Android Brower
3.2 3.5 9 9 10.6 3.2 2.1


这里我推荐使用Chrome。

简单的HTML5页面

  1. <!doctype html>  
  2.   
  3. <html lang="zh">  
  4.   
  5. <head>  
  6.     <meta charset="UTF-8">  
  7.     <title>基础的HTML5页面</title>  
  8. </head>  
  9.   
  10. <body> Hello Airing! </body>  
  11.   
  12. </html>  

演示运行结果如下:
2016317110813836.jpg (850×500)

HTML是由一个个形如尖括号<>的标签元素组成,这些标签通常是成对出现,并且标签之间只能嵌套不能交叉。
扩展:
成对出现的叫做闭合标签,单个出现的叫做单标签。不管怎样都是闭合的(单标签可以不闭合,但是在XHTML中严格要求了闭合)。闭合标签又分为开始标签和结束标签,如<body>是开始标签,</body>是结束标签。自标签如<input/> <br/>等。
关于更多的标签,建议大家自行了解一下。推荐W3school平台自学。
这里我们着重讲一下上述代码中出现的标签。

  1. <!doctype html>  

这个标签说明 Web 浏览器将在标准模式下呈现页面。根据 W3C 定义的 HTML5 规范,这是 HTML5 文档所必需的。这个标签简化了长期以来在不同的浏览器呈现 HTML 页面时出现的奇怪差异。它通常为文档中的第一行。

  1. <html lang="en">  

这是包含语言说明的<html>标签,例如,"en"为英语,"zh"为中文。

  1. <head>...</head>   

这2个标记符分别表示头部信息的开始和结尾。头部中包含的标记是页面的标题、序言、说明等内容,它本身不作为内容来显示,但影响网页显示的效果。头部中最常用的标记符是<title>标记符和<meta>标记符。

以下表格列出了HTML head 元素下的所有标签和功能:

标签 描述
<head> 定义了文档的信息
<title> 定义了文档的标题
<base> 定义了页面链接标签的默认链接地址
<link> 定义了一个文档和外部资源之间的关系
<meta> 定义了HTML文档中的元数据
<script> 定义了客户端的脚本文件
<style> 定义了HTML文档的样式文件

XML/HTML Code

您可能想查找下面的文章:

  • HTML5知识点总结
  • HTML5的本地存储
  • HTML5本地存储之IndexedDB
  • Html5实现文件异步上传功能
  • Html5新标签datalist实现输入框与后台数据库数据的动态匹配
  • 详解HTML5 window.postMessage与跨域
  • HTML5拖放API实现拖放排序的实例代码
  • 解决html5中video标签无法播放mp4问题的办法
  • HTML5新特性 多线程(Worker SharedWorker)
  • Html5新增标签有哪些

相关文章

  • 2018-12-03开发人员需要牢记的HTML 5安全问题
  • 2018-12-03如何 精通各种Web前端技术?
  • 2018-12-03关于html5如何在canvas中插入图片的示例详解
  • 2018-12-03H5中History模式的使用详解
  • 2018-12-03nodejs的爬虫框架superagent
  • 2018-12-03HTML5标签大全
  • 2018-12-03html5中关于socket.io实现一个聊天室的示例代码
  • 2017-08-06深入解析HTML5中的Blob对象的使用
  • 2018-12-03你必须知道的28个HTML5特征、窍门和技术
  • 2018-12-03教你如何塑造JavaScript牛逼形象

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • h5正常文本框提示语的实现方法
    • 用HTML5构建高性能视差网站的图文代码详解
    • 利用HTML5 Canvas制作一个简单的打飞机游戏_html5教程技巧
    • 快速搭建TP-LINK电信拓扑设备面板基于HTML5的实现方法
    • H5中的video标签无法播放mp4文件如何解决
    • html5视频与声频详解
    • html5教程制作简单画板代码分享_html5教程技巧
    • HTML5 or Silverlight?
    • C中字符串的定义方法及说明实例
    • HTML5新增属性

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有