使用一些js效果时,发现不同的html开头的doctype会出现不同结果。
一般用<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">对js支持较好。
HTML
* HTML 4.0 Strict: <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0//EN” “http://www.w3.org/TR/REC-html40/strict.dtd”>
* HTML 4.0 Transitional: <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>
* HTML 4.0 Frameset: <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN” “http://www.w3.org/TR/html4/frameset.dtd”>
* HTML 3.2: <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 3.2 Final//EN”>
* HTML 2.0: <!DOCTYPE HTML PUBLIC “-//IETF//DTD HTML//EN”>
XHTML
* XHTML 1.0 Strict: <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
* XHTML 1.0 Transitional: <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
* XHTML 1.0 Frameset: <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Frameset//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd”>
* XHTML 1.1: <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN” “http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd”>
说明一下,XHTML 1就是HTML 4.01的XML化,是一种不向前兼容的格式,未来的XHTML 2也不会向后兼容。汗……这是一个很可悲规范。
那么应该选择哪个?我相信很多人,尤其是接触了网页标准(Web Standards)的人,会毫不犹豫地选择XHTML 1.0 Transitional。这是一股趋势,这是一股潮流,暗示着,嘿嘿,伙计,看见没,我们的网站使用最新技术构建了……
这里有一个很有趣的统计,使用XHTML 1.0 Strict和Transitional的占绝大多数,且对半开。那么,这个世界就那么美好了吗?
我们先来看看W3C的建议,总结出下表:
前面说到,XHTML 1实际上是HTML 4.01的XML化。即时看起来,写起来,用起来都很像,但这是两种不同的规范。XHTML的MIME-TYPE应该是application/xhtml+xml,而HTML应该是text/html。两者有何不同,简单的说,application/xhtml+xml属于XML,所以行为遵循一切XML规范,最重要的是良构(Well-Formed)这一点。
除了XHTML 1.0 Transitional和Frameset,我们可以看到,XHTML 1.0 Strict和1.1都SHOULD使用application/xhtml+xml。然而,我们可以看到,前面提到的那个统计,并没有多少个网站使用application/xhtml+xml,可以说他们是扯虎皮做大旗而已(如果您有心查看一下本blog的源码,您会发现我也是),它们非良构的内容依然可以通过支持application/xhtml+xml的浏览器(如Firefox, Opera)来展现,因为它们本质上还是text/html,而text/html并不需要良构。
可以看到,XHTML 1.0 Transitional的地位很暧昧,它的Transitional 使得其MAY text/html,SHOULD application/xhtml+xml。也就是说,怎么处理,实际上交由客户端(client side)来决定。在我所见到的桌面浏览器中,它们都毫不犹豫地选择text/html,这跟它们一贯的宽容风格保持一致。
但是很不幸的是,就有这么一个浏览器,Opera for mobile,从8.0开始,凡是声明了XHTML的Doctype,它都一律以application/xhtml+xml来处理。所以,你那不良构的网站,只好在它上面显示出错信息。
所以,推荐使用XHTML 1.0 Transitional,是鼓励你从HTML向XHTML转化,且保持过渡性。但过渡性并不代表你就可以不重视XML的良构。
实际上,我们并没有能够发现XHTML 1.0 Transitional跟HTML 4.01 Strict有何不同,除了一个target,一些过时的表现标签和属性(attribute)。只要我们在HTML中不写作那些XHTML中不存在的标签和属性,我们实际上就是在写XHTML 1.0 Transitional,对我们并没有什么影响,什么XML的优越性完全不能在XHTML 1.0 Transitional中体现出来,所以与其让Opera for mobile(或许还有其他变数)不能工作,还不如选择HTML 4.01 Strict。在这点上,456BereaStreet.com做出了一个十分不错的选择。当然,如果您能保证你的XHTML 1.0 Transitional百分百良构,使用它是一个更佳的选择。然后,请你告诉我,世界上,使用了XHTML 1.0 Transitional的网站,非首页的其他页面能有多少个是能够通过验证的?
结论是,如果你没有勇气保证整个站点百分百良构,请使用HTML 4.01 Strict;如果您有勇气保证整个站点百分百良构,您可以直接选择XHTML 1.1,像我所做的那样。
DOCTYPE是document type(文档类型)的简写,用来说明你用的XHTML或者HTML是什么版本。
其中的DTD(例如上例中的xhtml1-transitional.dtd)叫文档类型定义,里面包含了文档的规则,浏览器就根据你定义的DTD来解释你页面的标识,并展现出来。
要建立符合标准的网页,DOCTYPE声明是必不可少的关键组成部分;除非你的XHTML确定了一个正确的DOCTYPE,否则你的标识和CSS都不会生效。
XHTML 1.0 提供了三种DTD声明可供选择:
过渡的(Transitional):要求非常宽松的DTD,它允许你继续使用HTML4.01的标识(但是要符合xhtml的写法)。完整代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
严格的(Strict):要求严格的DTD,你不能使用任何表现层的标识和属性,例如<br>。完整代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
框架的(Frameset):专门针对框架页面设计使用的DTD,如果你的页面中包含有框架,需要采用这种DTD。完整代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
我们选择什么样的DOCTYPE
理想情况当然是严格的DTD,但对于我们大多数刚接触web标准的设计师来说,过渡的DTD(XHTML 1.0 Transitional)是目前理想选择(包括本站,使用的也是过渡型DTD)。因为这种DTD还允许我们使用表现层的标识、元素和属性,也比较容易通过W3C的代码校验。
注:上面说的"表现层的标识、属性"是指那些纯粹用来控制表现的tag,例如用于排版的表格、背景颜色标识等。在XHTML中标识是用来表示结构的,而不是用来实现表现形式,我们过渡的目的是最终实现数据和表现相分离。
打个比方:人体模特换衣服。模特就好比数据,衣服则是表现形式,模特和衣服是分离的,这样你就可以随意换衣服。而原来HTML4中,数据和表现是混杂在一起的,要一次性换个表现形式非常困难。呵呵,有点抽象了,这个概念需要我们在应用过程中逐步领会。
补充
DOCTYPE声明必须放在每一个XHTML文档最顶部,在所有代码和标识之上。