`

网页的!DOCTYPE声明及对网页起何作用【转】

 
阅读更多

DOCTYPE 是document type(文档类型)的简写,在web设计中用来说明你用的XHTML 或者HTML是什么版本。

要建立符合标准的网页DOCTYPE声明 是必不可少的关键组成部分;除非你的XHTML确定了一个正确的DOCTYPE,否则你的标识和CSS 都不会生效,也就是说如果没有这个DOCTYPE声明将会导致CSS失效 -css无效 ,特别是没有声明或声明不正确将在标准浏览器下更是不能正常显示。

DOCTYPE声明
开始制作符合标准的站点,第一件事情就是声明符合自己需要的DOCTYPE。

查看很多使用XHTML标准开发的网站,第一行就是:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
打开一些符合标准的站点,例如著名web设计软件开发商Macromedia,会发现同样的代码。

而另一些符合标准的站点的代码则如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

那么这些代码有什么含义?一定要放置吗?
什么是DOCTYPE
上面这些代码我们称做DOCTYPE声明。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还允许我们使用表现层的标识、元素和属性,也比较容易通过W3C的代码校验。
注:上面说的"表现层的标识、属性"是指那些纯粹用来控制表现的tag,例如用于排版的表格、背景颜色标识等。在XHTML中标识是用来表示结构的,而不是用来实现表现形式,我们过渡的目的是最终实现数据和表现相分离。
打个比方:人体模特换衣服。模特就好比数据,衣服则是表现形式,模特和衣服是分离的,这样你就可以随意换衣服。而原来HTML4中,数据和表现是混杂在一起的,要一次性换个表现形式非常困难。呵呵,有点抽象了,这个概念需要我们在应用过程中逐步领会。
补充
DOCTYPE声明必须放在每一个XHTML文档最顶部,在所有代码和标识之上。


 
分享到:
评论

相关推荐

    HTML和XHTML的联系与区别,文档类型<!DOCTYPE>

    它们在互联网上起着至关重要的作用,为网页提供了结构和语义。虽然HTML和XHTML在很多方面相似,但它们之间存在一些关键的差异。 **HTML的起源与发展** HTML自1990年代初由蒂姆·伯纳斯-李发明以来,经历了一系列...

    IE下文本模式!DOCTYPE作用介绍

    在网页开发中,DOCTYPE声明是不可或缺的一部分,尤其是在处理与Internet Explorer(IE)浏览器兼容性问题时。DOCTYPE的作用在于指导浏览器如何解析HTML或XML文档,确保它们按照预设的规则渲染页面。本文将深入探讨...

    用HTML5.0制作网页的教程

    以前,我们需要输入复杂的DOCTYPE声明,但在HTML5中,只需要一行简单的`&lt;!DOCTYPE html&gt;`即可。这一改变使得创建文档变得更加直观,同时也为向后兼容提供了便利。 接下来,我们要讨论HTML5中的基本语义结构。这些...

    如何学习DIV CSS制作网页

    2. **DOCTYPE的重要性**:文档类型声明是告诉浏览器文档遵循何种标准的关键部分。不同的DOCTYPE会影响浏览器渲染页面的方式。常用的DOCTYPE有三种: - **过渡型 (Transitional)**:适用于包含某些过时或不规范...

    物理弹性滚动对联广告代码

    总的来说,理解DOCTYPE的作用,掌握其对页面渲染的影响,以及如何在JavaScript和CSS中处理这种影响,是提高网页开发技能的关键。同时,解决实际开发中遇到的问题,如本例中的滚动失效,也是提升开发者解决问题能力的...

    DIV+CSS布局大全

    DOCTYPE声明位于HTML文档的开头,它告诉浏览器文档所遵循的HTML或XHTML规范。对于CSS布局而言,选择正确的DOCTYPE至关重要,因为它会影响浏览器的渲染模式。例如,`&lt;!DOCTYPE html&gt;`用于HTML5,而`&lt;!DOCTYPE XHTML&gt;`...

    最新web前端面试题(及答案).docx

    DOCTYPE&gt;`告诉浏览器的解析器应该用何种文档标准解析当前文档。如果文档中的`&lt;!DOCTYPE&gt;`不存在或格式不正确,则可能导致文档以兼容模式呈现。 2. **标准模式与兼容模式的区别:** - **标准模式:** 在这种模式下,...

    让你的网站IE8浏览自动用IE7兼容模式

    这一特性允许开发者指定浏览器以何种模式解析和渲染网页。 在IE6时代,有两种主要的编译模式:“Quirks mode”和“Standards mode”。Quirks mode是为了向后兼容旧版浏览器,而Standards mode则遵循当时的业界标准...

    36个非常重要但常被遗忘的HTML标签

    DOCTYPE&gt;` 是一个文档类型声明,它告诉浏览器该文档应该按照何种规范进行解析。这个标签虽然不是真正的HTML标签,但它对于确定浏览器如何渲染页面至关重要。 - **DTD (Document Type Definition)**:定义了HTML或...

    Web前端:11个让你代码整洁的原则(1)

    DOCTYPE声明是HTML文档的第一行,用于告诉浏览器以何种标准解析文档。选择正确的DOCTYPE对于确保网页在不同浏览器中的兼容性和一致性至关重要。当前,推荐使用HTML5的DOCTYPE声明,即`&lt;!DOCTYPE html&gt;`,因为它最...

    面试整理(含答案)最新版.docx

    DOCTYPE&gt;`声明至关重要,因为它指示浏览器使用何种规范解析文档。缺失或格式错误的`&lt;!DOCTYPE&gt;`会导致文档进入混杂模式,而非严格模式。严格模式遵循W3C标准,而混杂模式则兼容旧版浏览器的行为。 HTML5引入了许多...

    1_面试总结.docx

    DOCTYPE&gt; 声明位于文档中的最前面,处于 &lt;html&gt; 标签之前。告知浏览器以何种模式来渲染文档。 四、img 标签的 title 和 alt 属性的区别 alt 属性指定了图像不能显示时的替代文字,而 title 属性指定了鼠标悬浮在...

    2016年web前端5大类型面试题汇总

    `Doctype`的作用及标准模式与兼容模式的区别** - **`Doctype`的作用**: 告知浏览器解析器使用何种文档标准解析文档。 - **标准模式与兼容模式的区别**: - **标准模式**: - 按照最新的Web标准解析文档。 - 提供...

    html实现的简单的用户登陆界面

    此行代码告知浏览器遵循何种规范来解析文档。 - **`&lt;html&gt;`**: 定义了整个HTML文档的根元素。 - **`&lt;head&gt;`**: 包含关于HTML文档的信息,如标题、样式、脚本等。 - **`&lt;title&gt;`**: 设置网页的标题,在浏览器标签页上...

    asp.net显示自己的网页图标的几种方式

    在互联网的多标签浏览器中,每个标签页的左上角都会显示一个网页图标,称之为favicon(网页图标)。用户可以通过这个小图标快速识别网页内容。在***环境下,有几种方法可以在浏览器中显示自己的网页图标。 首先,最...

    html入门指导教程

    #### 一、课程概述及目标 - **目标**: - 能够使用HTML语言搭建网页框架(1.5天):了解HTML的基本语法、结构以及如何创建基本的网页布局。 - 能够使用CSS样式提高用户体验(1.5天):学习如何使用CSS来美化网页,...

    前端html、javascript面试宝典

    1. `Doctype`声明:用于告诉浏览器以何种标准模式解析HTML文档,例如`&lt;!DOCTYPE html&gt;`声明的是HTML5标准模式。 2. Quirks模式和Standards模式:Quirks模式是浏览器对早期HTML和CSS的非标准解析方式,而Standards...

Global site tag (gtag.js) - Google Analytics