标签 HTML5 下的文章

HTML5学习笔记(2) - 使用 Audio API 自己动手设计HTML5音乐播放器

这篇文章记录的是 HTML5中的 Video 和 Audio 标签,以及我自己设计的 Audio 播放器,如果看完了累了就听听歌吧啊哈 ~

Video - 视频

大多数视频是通过插件(比如 Flash)来播放的,然而,并非所有浏览器都拥有同样的插件

HTML5 规定了一种通过 video 元素来包含视频的标准方法,利用 Video 标签。

视频格式

当前,video 元素支持三种视频格式:ogg 、MPEG4 、WebM

  • Ogg = 带有 Theora 视频编码和 Vorbis 音频编码的 Ogg 文件
  • MPEG4 = 带有 H.264 视频编码和 AAC 音频编码的 MPEG 4 文件
  • WebM = 带有 VP8 视频编码和 Vorbis 音频编码的 WebM 文件

使用非常广泛的 Firefox 目前并不支持 MPEG4 格式,仅支持 ogg 格式,Safari仅支持 MPEG4 格式

如何工作

我们可以这样引用:

Read More »

HTML5学习笔记(1)

什么是 HTML5?

HTML5 将成为 HTML、XHTML 以及 HTML DOM 的新标准。

HTML 的上一个版本诞生于 1999 年。自从那以后,Web 世界已经经历了巨变。

HTML5 仍处于完善之中。然而,大部分现代浏览器已经具备了某些 HTML5 支持。

HTML5 中的一些有趣的新特性

  • 用于绘画的 canvas 元素
  • 用于媒介回放的 video 和 audio 元素
  • 对本地离线存储的更好的支持
  • 新的特殊内容元素,比如 article、footer、header、nav、section
  • 新的表单控件,比如 calendar、date、time、email、url、search

特点:

- 取消了一些HTML4里过时的元素和属性标记

其中包括纯粹显示效果的标记,如<font>和<center>,它们已经被CSS取代。HTML5 吸取了XHTML2 一些建议,包括一些用来改善文档结构的功能,比如,新的HTML 标签 header, footer, dialog, aside, figure 等的使用,将使内容创作者更加语义地创建文档,之前的开发者在实现这些功能时一般都是使用div

- 内容与展示分离

b 和 i 标签依然保留,但它们的意义和之前有所不同,这些标签的意义只是为了将一段文字标识出来,而不是为了为它们设置粗体或斜体式样。u,font,center,strike 这些标签则被完全去掉了。

- 新增加一些全新的表单输入对象

包括日期,URL,Email 地址,其它的对象则增加了对非拉丁字符的支持。HTML5 还引入了微数据,这一使用机器可以识别的标签标注内容的方法,使语义Web 的处理更为简单。总的来说,这些与结构有关的改进使内容创建者可以创建更干净,更容易管理的网页,这样的网页对搜索引擎,对读屏软件等更为友好。

- 全新的、更合理的标签

多媒体对象将不再全部绑定在 object 或 embed Tag 中,而是视频有视频的Tag,音频有音频的 Tag。

- 本地存储

这个功能将内嵌一个本地的SQL 数据库,以加速交互式搜索,缓存以及索引功能。同时,那些离线Web 程序也将因此获益匪浅。不需要插件的富动画。

将给浏览器带来直接在上面绘制矢量图的能力,这意味着用户可以脱离Flash 和Silverlight,直接在浏览器中显示图形或动画。

- 新的API扩展

为HTMLDocument和HTMLElement借口提供了新的API扩展。

- HTML5取代Flash和Silverlight

Read More »