跟我学HTML5(入门教程)

HTML5从字面上很容易理解,就是HTML技术标准的第五版。HTML5提供了很多新的特性。如:播放视频、拖拽等。下面通过一个HTML5例子来介绍HTML5播放视频作为入门实例。

什么是 HTML5?

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

HTML5 是如何起步的?

HTML5 是 W3C 与 WHATWG 合作的结果。WHATWG 致力于 web 表单和应用程序,而 W3C 专注于 XHTML 2.0。在 2006 年,双方决定进行合作,来创建一个新版本的 HTML。

注:W3C 指 World Wide Web Consortium,万维网联盟。

注:WHATWG 指 Web Hypertext Application Technology Working Group。

为 HTML5 建立的一些规则:

  • 新特性应该基于HTML、CSS、DOM以及JavaScript。

  • 减少对外部插件的需求(比如 Flash)

  • 更优秀的错误处理

  • 更多取代脚本的标记

  • HTML5应该独立于设备

  • 开发进程应对公众透明

新特性

  • HTML5 中的一些有趣的新特性:

  • 用于绘画的 canvas 元素

  • 用于媒介回放的 video 和 audio 元素

  • 对本地离线存储的更好的支持

  • 新的特殊内容元素,比如 article、footer、header、nav、section

  • 新的表单控件,比如 calendar、date、time、email、url、search

浏览器支持

最新版本的 Safari、Chrome、Firefox 以及 Opera 支持某些 HTML5 特性。Internet Explorer 9 将支持某些 HTML5 特性。

实例:使用HTML5播放视频。

<!DOCTYPE HTML>
<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <video width="320" height="240" controls="controls">
        <source src="doc/movie.ogg" type="video/ogg">
        <source src="doc/movie.mp4" type="video/mp4">
        Your browser does not support the video tag.
   </video>
</html>

运行结果:

html5播放视频结果截图

「资源下载」

成熟不是人的心变老,而是泪在眼眶里打转还能微笑。
0 不喜欢
说说我的看法 -
全部评论(
没有评论
关于
本网站属于个人的非赢利性网站,转载的文章遵循原作者的版权声明,如果原文没有版权声明,请来信告知:hxstrive@outlook.com
公众号