用HTML5.0制作网页的教程

这个构想是停止HTML版本化,使向后兼容变得更容易。从长远看是不是成功是另外的事情,但至少 他节省了你输入的平均时间。

在大家钻研新标签前,想想你通常网页的结构,大概像如此:

section
Section可能是新标签中最模糊的。依据HTML 5概念,一个章节是一个内容的主题集合,一般在header标签后,在footer标签前。但假如 需要,section也可以相互嵌套。

这对于展示作用与功效非常不错,但假如大家想要知晓一些关于页面元素包含什么的问题,这又如何解决呢?

2. nav

HTML,网站设计
依据你们询问的人,HTML 5不是迈向创造更语义化的互联网的下一 个要紧节奏,就是用一系列不完整的标签和标记大杂烩让互联网陷入困境的灾难。

这就是新结构标签到来的原因。

2. 最后,一个其他人都可以记住的文档种类

为了帮知道当今HTML 5的一些新玩意儿,大家目前就进入正题,开始用一些新的结构元素。

nav
nav元素很明显,这是你的导航元素。当然什么被算为导航是有一些争议的,有一个基本的站点 导航,但一些状况下还可能有页面导航元素。HTML5的缔造者WHATWG近期在修改nav的讲解,来表现如何在同一个页面用两次。

这真是痛苦,也是为何大家喜欢新的HTML 5文档种类。你筹备好了么?他出现了:

4. 把他们放在一块

在大家上面的例子里,被content标记的p就是一个变为section的非常不错的选 择。另外在那个section内,依据内容,大家可以增加section。

HTML 5有哪些不同?
第一,大家通过HTML 5表达什么?First off, what do we mean by HTML 5?理论上,大家表达所有些事新的语义结构标签,比如canvas或者离线储存等API规范,与新的内联语义标签。尽管这样,大家把实质是什么原因 仅仅局限于结构标签。canvas,离线储存,当地视频或者地理定位API都非常绝妙,然而他们还不可以被所有浏览器一致的支持。

最基本语义结构
大家已经将大家的页面概念为HTML 5文档。到目前为止,所有都还很好。目前,这部分大家已经听说的新标签到底是什么?

1. header

但等等你说,大部分浏览器也都不支持新的结构元素!这是真的,但他们中的绝大部分将 会非常乐意去同意你想要创建的任何标签。甚至连IE6也可以处置新标签,尽管假如你想要用CSS设置样式,你需要一点JavaScript的帮忙。

更多关于nav的信息与关于HTML5的激烈争论,参见Jeffrey Zeldman关于nav元素的文章。

假如你还在用p id=nav标签来包含你的页面导航,你可以用简单的nav标签来替换。

当认识到这部分ID成为了惯例,HTML 5的缔造者们更进一步,使这部分元素中的一部分变成他们独立的标签。这儿有一个HTML 5中生效的新标签的迅速概要:

6. 兼容老的浏览器

1. article

上面的例子中,大家为大家所有些结构p添加了ID。这在有见识的设计师中是非常平时的事。目 的有两个方面,第一,ID提供了可以可以用于给页面的特殊段落应用样式的锚,第二,ID充当基本的伪语义结构。高明的分析器将会查询标签的ID属性,并尝试 去猜测他们包含的意思,但当每一个站点的ID名字不一样的时候非常难。

header
头部标签被设计作为关于一个章节或者一整张网页介绍信息的容器。header 标签可以包含从你坐落于大部分页面顶部的典型标志或者标语,到介绍一个章节的标语和开场白的任何东西。假如你还在你的页面里用p id=header,那可以用header替换

当你对新标签设置样式时,你需要记住一件事,那就是未知标签在大多数浏览器中没默认样式。他 们同时被觉得是行级元素。尽管这样,因为大多数HTML 5的新标签可以架构,大家将让他们拥有块级元素的行为。解决方案是确认你在CSS样式中包含了display:block;。

不会太难记。容易并且容易理解。不区别大小写。

3. section

2. aside

即使这样,大家不难发现下一代互联网标记工具有哪些好处和潜在的问题。

3. 最基本的语义结构

article
根绝WHATWG的注释,article元素可以包含组成文档或站点独立部分的一段内容;例 如,杂志或者新闻的文章,或者博客条目。

内容
1. HTML 5有哪些不同?

3. footer

7. 目前你可以用HTML 5了,但你会用么?

争论双方的问题在于,极少的站点在自然环境下用HTML 5,所以目前所认识到的问题的理论解决方法仍然在非常大程度上未经考验。

最后,一个其他人都可以记住的文档种类
大家创建HTML 5文档第一件需要做的事情就是用新的文档种类。目前,假如你还了解的记得HTML 4或者XHTML 1.x的文档种类,你真是一个比大家更强的淘气鬼。每当大家新建一个页面,大家需要打开一个旧的文件,剪切并粘贴文档种类概念。

5. 为新元素撰写样式

上一篇:Python 初始化多维数组代码 下一篇:没有了