HTML5的结构和语义(1):前言


Posted in HTML / CSS onOctober 17, 2008

超文本标记语言(HTML)5 第一次向 HTML 中引入新的元素。新的结构元素包括 aside、figure 和 section。新的内联元素包括 time、meter 和 progress。新的内嵌元素有 video 和 audio。新的交互元素有 details、datagrid 和 command。

超文本标记语言(HTML)的开发到 1999 年 HTML 4 就停止了。万维网联盟(W3C)把重点转向将 HTML 的底层语法从标准通用标记语言(SGML)改为可扩展标记语言(XML),以及可缩放向量图型(SVG)、XForms 和 MathML 这些全新的标记语言。浏览器厂商则把精力放到选项卡和富站点摘要(RSS)阅读器这类浏览器特性上。Web 设计人员开始学习使用异步 JavaScript XML(Ajax),在现有的框架下通过层叠样式表(CSS)和 JavaScript™ 语言建立自己的应用程序。但是在接下来的八年中,HTML 本身没有任何变化。

最近,它又复活了。三家重要的浏览器厂商 — Apple、Opera 和 Mozilla Foundation — 成立了 Web Hypertext Application Technology Working Group(WhatWG)来开发传统 HTML 的新版本。最近,W3C 也注意到了这些活动,也启动了自己的新一代 HTML 项目,双方的成员有很多是相同的。这两个项目最终很可能合并。虽然很多细节还在争论之中,但下一版本 HTML 的大体轮廓已经清楚了。

Web 开发人员从 1999 年就一直期待 HTML 的新版本(通常称为 HTML 5,但是也称为 Web Applications 1.0),现在它终于发布了。它保持了 HTML 原来的特色:没有名称空间或模式。元素不必结束。浏览器会宽容地对待错误。p 仍然是 p,table 仍然是 table。

如果在 1999 年将一位 Web 开发人员冷冻起来,现在再解冻,那么他会遇到一些新的让人迷惑的元素。是的,他熟悉的元素(比如 div)仍然保留了;但是,HTML 现在还包含 section、header、footer 和 nav 等新元素。em、code 和 strong 仍然存在,但是增加了 meter、time 和 m。img 和 embed 仍然可用,但是还增加了 video 和 audio。但是,他仔细观察一下就会发现,这些元素实际上没什么区别。其中许多元素可能在 1999 年是开发人员需要而没有得到的。通过与他已经掌握的元素进行简单的类比,这些新元素都很容易理解。实际上,与 Ajax 或 CSS 相比,它们非常容易掌握。

最后,当他打开 300MHz 的笔记本(运行的是 Windows 98,也是在 1999 年冷冻起来的)时,他可能对 Netscape 4 和 Windows® Internet Explorer® 5 中显示的新页面效果很吃惊。当然,这些老式浏览器不认识新元素,会完全忽略它们,但是页面仍然会显示,内容仍然是完整的。

这并不是什么虚构的故事。HTML 5 的设计原则就是在不支持它的浏览器中能够平稳地退化。原因很简单:我们都是这样的 “原始人”。浏览器现在有选项卡、CSS 和 XmlHttpRequest,但是它们的 HTML 显示引擎仍然停留在 1999 年的水平。除了用户量大大增加之外,Web 其实在本质上没什么进步。HTML 5 考虑到了这一点。它目前为 Web 开发人员一些真正的好处,随着浏览器的缓慢升级,页面浏览者会逐渐享受到这些好处。

我们来看看 HTML 5 提供了什么。

(待续)

HTML / CSS 相关文章推荐
超酷炫 CSS3垂直手风琴菜单
Jun 28 HTML / CSS
CSS3——齿轮转动关键代码
May 02 HTML / CSS
CSS3控制HTML元素动画效果
Feb 08 HTML / CSS
纯CSS3实现滚动的齿轮动画效果
Jun 05 HTML / CSS
html5+css3之CSS中的布局与Header的实现
Nov 21 HTML / CSS
css3动画效果小结(推荐)
Jul 25 HTML / CSS
用HTML5中的Canvas结合公式绘制粒子运动的教程
May 08 HTML / CSS
用HTML5 实现橡皮擦的涂抹效果的教程
May 11 HTML / CSS
html5本地存储 localStorage操作使用详解
Sep 20 HTML / CSS
HTML5的Video标签有部分MP4无法播放的问题解析(多图)
Aug 18 HTML / CSS
HTML5 video循环播放多个视频的方法步骤
Aug 06 HTML / CSS
HTML5之高度塌陷问题的解决
Jun 01 HTML / CSS
HTML5的结构和语义(3):语义性的块级元素
Oct 17 #HTML / CSS
HTML5的结构和语义(2):结构
Oct 17 #HTML / CSS
HTML5的结构和语义(4):语义性的内联元素
Oct 17 #HTML / CSS
HTML5中语义化 b 和 i 标签
Oct 17 #HTML / CSS
HTML5的结构和语义(5):内嵌媒体
Oct 17 #HTML / CSS
HTML5的结构和语义(5):交互
Oct 17 #HTML / CSS
HTML5 语义化结构化规范化
Oct 17 #HTML / CSS
You might like
?算你??的 PHP 程式大小
2006/12/06 PHP
PHP 在线翻译函数代码
2009/05/07 PHP
使用XDebug调试及单元测试覆盖率分析
2011/01/27 PHP
深入理解PHP中的global
2014/08/19 PHP
PHP常用操作类之通信数据封装类的实现
2017/07/16 PHP
Yii2框架视图(View)操作及Layout的使用方法分析
2019/05/27 PHP
javascript新建标签,判断键盘输入,以及判断焦点(示例代码)
2013/11/25 Javascript
jQuery动画效果animate和scrollTop结合使用实例
2014/04/02 Javascript
《JavaScript DOM 编程艺术》读书笔记之DOM基础
2015/01/09 Javascript
JS模仿编辑器实时改变文本框宽度和高度大小的方法
2015/08/17 Javascript
基于jquery实现三级下拉菜单
2016/05/10 Javascript
js实现div模拟模态对话框展现URL内容
2016/05/27 Javascript
浅谈JS原生Ajax,GET和POST
2016/06/08 Javascript
详解微信小程序设置底部导航栏目方法
2017/06/29 Javascript
JS非行间样式获取函数的实例代码
2018/06/05 Javascript
js实现ajax的用户简单登入功能
2020/06/18 Javascript
Vue+element+cookie记住密码功能的简单实现方法
2020/09/20 Javascript
Python 命令行非阻塞输入的小例子
2013/09/27 Python
Python实现从百度API获取天气的方法
2015/03/11 Python
深入理解python中的浅拷贝和深拷贝
2016/05/30 Python
Python编程中装饰器的使用示例解析
2016/06/20 Python
Python 爬虫图片简单实现
2017/06/01 Python
基于Python和Scikit-Learn的机器学习探索
2017/10/16 Python
Python random模块用法解析及简单示例
2017/12/18 Python
django的ORM操作 删除和编辑实现详解
2019/07/24 Python
Python使用python-docx读写word文档
2019/08/26 Python
python中的RSA加密与解密实例解析
2019/11/18 Python
TensorFlow实现批量归一化操作的示例
2020/04/22 Python
美国女士时尚珠宝及配饰购物网站:Icing
2018/07/02 全球购物
施华洛世奇西班牙官网:SWAROVSKI西班牙
2019/06/06 全球购物
JoJo Maman Bébé爱尔兰官网:英国最受欢迎的精品母婴品牌
2020/12/20 全球购物
乡镇务虚会发言材料
2014/10/20 职场文书
三八红旗手事迹材料
2014/12/26 职场文书
九寨沟导游词
2015/02/02 职场文书
初中物理教学反思
2016/02/19 职场文书
redis 解决库存并发问题实现数量控制
2022/04/08 Redis