HTML5使用实例

charrysong

从HTML4诞生以来，整个互联网环境、硬件环境都发生了翻天覆地的变化，开发者期望标准统一、用户渴望更好体验的呼声越来越高。20年磨一剑，HTML5作为下一代Web标准，它的新特性正在每个新式浏览器的版本中快速的得到支持和体现。随着HTML5和CSS3的发展和完善，Web应用程序正在逐渐的表现出桌面应用的性能和功能，和桌面应用之间的区别将越来越模糊。未来不能用HTML5来实现的功能将越来越少，未来绘图、视频编辑、3D建模等也将从单机软件转到浏览器上通过Web应用程序来实现。
    下文，我将结合实例，谈谈激动人心的HTML5之美。
1、语义之美
   语义化很美，在合适的地方使用合适的标签，把人和机器一视同仁。书写语义化的页面就像建造符合工业标准的建筑，阅读语义化的页面像阅读一本你熟识的优美著作。
    HTML5的语义化标签包括：
•<section>-代表文档中的一段或者一节；
•<nav>-用于构建导航；
•<article>-表示文档、页面、应用程序或网站中一体化的内容；
•<aside>-代表与页面内容相关、有别于主要内容的部分；
•<hgroup>-代表段或者节的标题；
•<header>-页面的页眉；
•<footer>-页面的页脚；
•<time>-表示日期和时间；
•<mark>-文档中需要突出的文字。
    和采用css+div进行页面布局的方式相比，这些新标签明确的表现了页面元素的结构和含义。下面的代码展示了这样的一个示例：(运行代码时请使用支持HTML5浏览器)
<div class="dp-highlighter"><div class="bar"><div class="tools">Html代码运行