Mozilla HTML5 Dashboard:HTML5新技术演示集合

HTML如今已经进入v5时代,CSS也进入了v3时代,JavaScript也有了更炫的用法,随着现代浏览器的演进,使得越来越多的Web应用可以呈现出令人惊叹的效果。

Mozilla在HTML5标准的制定和技术推广方面做出了巨大的贡献,HTML5 Dashboard是Mozilla推出的一个HTML5技术演示项目,如果你想了解HTML5、CSS3、JavaScript中新增了哪些特性、这些特性有什么用以及如何用,那么HTML5 Dashboard将是一个非常好的途径。

HTML5 Dashboard地址:HTML5 Dashboard

HTML5 Dashboard中的演示包括:

HTML5演示:

  • 编解码器
  • ContentEditable属性
  • HTML5解析器
  • 语义标签:<!DOCTYPE html><header> <nav><section><article><aside><footer>
  • <audio>标签
  • 表单元素和属性
  • Audio Data API
  • WebGL

CSS3演示:

  • Transform(转换)属性
  • Transition(过渡)属性
  • @media Queries属性
  • 结构性伪类
  • Border Radius(边框半径)属性
  • Border Image(边框图片)属性
  • Gradients(渐变)属性
  • 多重背景
  • 列布局
  • box-shadow(盒阴影)属性
  • Text Shadow(文本阴影)属性
  • any()、calc()
  • image-rect
  • -moz-element
  • 蒙版、过滤器、修剪路径
  • @font-face、font-feature-settings
  • WOFF(Web开放字体格式)

此外还包括JavaScritp、SVG相关属性的演示和教程,以及Web应用性能和安全方面的知识。

这些演示项目都是开源的,源码托管在Github:https://github.com/paulrouget/html5dashboard/

更多演示

Mozilla HTML5 Dashboard是最新HTML5技术的演示集合,如果想了解这些技术的具体应用,可观看Mozilla Demo Studio,目前该项目中共包含843个演示,以及相关的源码。

开发者如果有Web开放技术相关的演示,也可以提交,提交地址:https://developer.mozilla.org/zh-CN/demos/submit

更多信息

Tagged: , ,

Comments are closed.