HTML5入门

HTML5是下一代的HTML。

什么是HTML5

HTML5将成为HTML、XHTML以及HTML DOM的新标准。
HTML的上一个版本诞生于1999年。自从那以后,Web世界已经经历了巨变。HTML5仍处于完善之中。然而,大部分现代浏览器已经支持HTML5特性。

HTML5是如何起步的?

HTML5是W3C与WHATWG合作的结果

W3C是指World Wide Web Consortium,万维网联盟
WHATWG是指 Web Hypertext Application Technology Working Group。
WHATWG致力于web表单和应用程序,而W3C专注于XHTML2.0.在2006年,双方决定进行合作,来创建一个新版本的HTML。

HTML5开发建立的一些规则是:

  • 新特性应该基于HTML、CSS、DOM以及JavaScript
  • 减少对外部插件的需求(比如Flash)
  • 更优秀的错误处理
  • HTML5应该独立于设备
  • 开发进程应对公众透明

HTML5新特性

  • 用于会话的Canvas元素
  • 用于媒介回放的video和audio元素
  • 对本地离线存储的更好的支持
  • 地理定位、套接字、Web工作线程
  • 新的特殊内容元素,比如article、footer、header、nav、section
  • 新的表单控件,比如calender、date、time、email、URL、search

HTML5示例

文件后缀为:.html






  This is Shenzhen
  





Hello World!

细看来,不是杨花,点点是调式泪。

  • 标签用于描述网页
  • 表示可见的页面内容
  • < h1 >文本显示为标题
  • < p >文本显示为段落

HTML5工作流程

  1. 浏览器加载一个文档,其中包括用HTML写的标记和用CSS写的样式。
  2. 浏览器加载页面时,会为你的文档创建一个内部模型,其中包含HTML标记的所有元素。这个模型就是文档对象模型(Document Object Model),简称为DOM。
  3. 浏览器加载页面时,还会加载JavaScript代码,通常是页面加载之后就开始执行这些代码。
  4. 通过这些API,你就可以访问音频和视频、使用画布完成2D绘图、访问本地存储,还可以使用构建应用所需的很多其他优秀技术。要使用所有这些API,需要用到JavaScript。

主要的JavaScript API有:套接字、画布、离线缓存、Web工作线程、视频、本地存储、音频、表单、拖放、地理定位。

JavaScript

JavaScript为你的Web应用打开了一个新的世界,提供类丰富的描述和功能下面来看看利用JavaScript和HTML5可以做的的一些事情:

  • 直接在页面上创建一个可绘制的2D表面,根本无需插件
  • 使页面掌握位置信息,知道你的用户所在的位置
  • 使用Web工作线程可以 提高JavaScript代码的效率,完成一些复杂的计算
  • 使用浏览器存储在本地缓存数据,提高移动应用的速度
  • 不需要特使插件来播放视频
    ...
    ...
    ...

当我们谈论HTML5时,我们在谈论什么

非官方说法: 标记 + JavaScript + CSS = HTML5

大多数人谈论HTML5的种种承诺时,实际上就是指所有这些技术的结合。也就是说,我们会有标记来搭建页面的核心结构,用JavaScript和所有相关API增加行为和新功能,另外用CSS为页面增加样式,它们结合在一起,这些就是我们用来构建未来Web应用的技术。

JavaScript和HTML示例






  My First JavaScript
  









浏览器运行结果如下:

HTML5入门_第1张图片
1.first.png

你可能感兴趣的:(HTML5入门)