介绍 本系列博客将主要介绍如今大红大紫的移动Web应用程序开发最重要的三个工具：HTML5，JavaScript， CSS3。 本篇是HTML5介绍的第二篇，主要介绍HTML5的新功能，包括新的标记元素，多媒体元素，表单元素和输入类型属性。 相关文章： 移动Web应用程序开发 HTML5篇 (一) HTML5简介 •1. HTML5 新的标记元素 HTML5提供了很多新的标记元素来表示和展现网页内容，最常见的就是article, aside, nav, detail, footer等，分别用来表示网页中的不同部分。比如说一个文章的内容，在HTML5中只需要写：<article></article>即可，而在传统HTML4中需要写成<div class="article"></div>。我们先看下面这张图。 这样做的好处就是能够更加的语义化，当搜索引擎检索网页时，可以明确知道哪些内容是正文的，哪些内容是导航条，哪些是底角标注。也就是说使用HTML5新的标记元素写出的网页能够更容易被搜索引擎检索到。更加详细的tag如下图所示。 本文附件 为一个典型的HTML5网页代码，读者可以下载测试。点此下载。 •2. 多媒体元素 多媒体元素可以说是HTML5非常重要的一点，用户可以直接通过代码<video src="xyz.ogv" type=video/ogg"></video> 来插入一个video，而在传统的HTML4中需要写<object type="video/ogg" data="xyz.ogv"><param name="src" value="xyz.ogv"></object>一长串代码。 Audio & Video 例子下载地址：Audio & Video。当然，除了video的原生支持还有音频支持，插件支持等等,也正是这个功能成为秒杀Flash等传统工具，提升浏览体验，减轻系统资源负载的重要法宝。 •3. 表单元素 HTMl5添加了很多原生表单支持，如datalist， Keygen等等。 •4. HTML5 输入类型元素 可以说添加了众多输入类型元素，使得HTML5成为适合开发移动web应用的一个重要因素，只需要简单的一个tag就可以实现输入日期，电子邮件，Url等等以前来说比较复杂的操作。 目前HTML5输入类型元素的支持情况： 本篇完，Demo下载地址： HTML5 new tag， Audio & Video。 本文及demo代码参考资料："Pro. HTML5 [...] |