在HMTL5中页面的最顶端代码就是:

<!DOCTYPE html>

为何要如此定义、书写呢?

首先引入一个概念:文档类型,英译为:Document type,缩写成:doctype.

文档类型有何作用呢?

在计算机世界中存在许多不同文件类型或称为文件扩展名,比如.txt,.log,.doc,.wps,.xml….。计算机根据不同的文档类型来选择相对应的软件对文件进行打开,修改等操作!同样Web世界中存在许多不同的文档,但是Web网页是使用浏览器来打开、渲染、显示,如何才能让浏览器正确地显示文档呢,这就需要了解文档的类型!

HTML有多个不同的版本,只有准确的在页面中指定确切的HTML版本,浏览器才能正确无误的显示HTML页面。这就是<!DOCTYPE>的用处。

<!DOCTYPE> 不是HTML标签,它只是为浏览器提供一项声明,因此它没有闭合/结束标签!

HTML文档类型的种类:

由于历史原因,HTML有着多个版本,目前使用比较广泛的仍然是:

1999制定的HTML 4.01, 2000年制定的XHTML 1.0,2012制定的HTML5。不过需要特别说明的是:HTML5目前只是初稿!

HTML 4.01规定了三种文档类型:Strict, Transitional, 以及Frameset. 中译为:严格版本,过渡版本,以及基于框架的版本!

XHTML 1.0同样也规定的三种文档类型:Strict, Transitional, 以及Frameset. 中译为:严格版本,过渡版本,以及基于框架的版本!

它们名称相同,但是声明的方式,有略微区别!

DOCTYPE的语法:  HTML 顶级元素 可用性 “注册组织//类型 标签//定义语言”"URL” .

以下面这个 <!DOCTYPE> 标签为例:

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

根元素是 html,

注册组织:W3C,

类型标签:XHTML 1.0 Strict,

定义语言:EN.

URL:http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd。

它在公共标识符被定义为 "-//W3C//DTD XHTML 1.0 Strict//EN" 的 DTD 中进行了定义。浏览器将明白如何寻找匹配此公共标识符的 DTD。如果找不到,浏览器将使用公共标识符后面的 URL 作为寻找 DTD 的位置。

始终要明白:URL只是替补!

Strict:

HTML 4.01:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "
http://www.w3.org/TR/html4/strict.dtd"> XHTML 1.0:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Transitional:

HTML 4.01:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "
http://www.w3.org/TR/html4/loose.dtd"> XHTML 1.0:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Frameset:

HTML 4.01:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "
http://www.w3.org/TR/html4/frameset.dtd"> XHTML 1.0:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

XHTML 1.0与HTML 4.01文档类型声明复杂并且难理解,但是在HTML5中,就简单许多了!!!

注意:虽然规定有三种文档类型,但是在每一张网页中只能同时声明一种规范!

文档类型,在使用集成开发工具时,基本都会自动添加。有时候使用记事本编写HTML代码时,往往会忘记声明文档类型,如果是复杂的页画那么在浏览器显示时就很容易会错排!

HTML文档类型的更多相关文章

  1. Doctype文档类型、作用及触发方式

    Doctype文档类型 1)  该标签可声明三种 DTD 类型,分别表示严格版本.过渡版本以及基于框架的 HTML 文档. 2)  HTML 4.01 规定了三种文档类型:Strict.Transit ...

  2. Umbraco文档类型定义多个template

    利用这个可以同时写PC端和手机端的网站, 在Template中,建立手机端的模板: 在文档类型中,同时选择两个模板,在浏览的时候在URL后加上Template的名称 + .aspx 就可以浏览到你写的 ...

  3. DOCTYPE html PUBLIC 指定了 HTML 文档遵循的文档类型定义

    DOCTYPE html PUBLIC 指定了 HTML 文档遵循的文档类型定义 今天看到一篇CSS应用的一个友好搜索,我按网页上的代码复制.粘贴后预览时总达不到效果,而直接拷贝他的实例却能达到效果, ...

  4. 彻底解决android读取中文txt的乱码(自动判断文档类型并转码

    原文:http://blog.csdn.net/handsomedylan/article/details/6138400 public String convertCodeAndGetText(St ...

  5. HTML&CSS基础学习笔记1.4-定义文档类型

    Web 世界中存在许多不同的文档.只有了解文档的类型,浏览器才能正确地显示文档. HTML 也有多个不同的版本,只有完全明白页面中使用的确切 HTML 版本,浏览器才能完全正确地显示出 HTML 页面 ...

  6. doctype(文档类型)的作用是什么?转载

    <!DOCTYPE> 声明位于文档中的最前面的位置,处于 <html> 标签之前.此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范. Document Type ...

  7. HTML文档类型DTD与浏览器怪异模式

    虽然在兼容IE6时候经常会注意到两个模式的区别,但是系统的理解起来,还没有认真总结过.看了一些网上的资料.结合自己的理解汇总了一下,放在这里备忘并分享给大家. 浏览器从服务端获取网页后会根据文档的DO ...

  8. 有效的XML: DTD(文档类型定义)介绍(转)

    文档类型定义和命名空间 有效(Valid)的XML文档: 首先,XML文档是个格式正规的(Well-formed)XML文档:(见格式正规的XML:语法 属性 实体 处理指令 样式单 CDATA节). ...

  9. !DOCTYPE html文档类型声明简写 HTML5 DOCTYPE缩写

    html5之!DOCTYPE html文档类型声明简写,在HTML5中DOCTYPE简写非常重要. 一.概述   -   TOP 让CSS样式表生效,DOCTYPE声明是必须的,以前TABLE布局的网 ...

随机推荐

  1. MySQL编程(0) - Mysql中文乱码问题解决方案

    MySQL 5.6 for Windows 解压缩版配置安装: http://jingyan.baidu.com/article/f3ad7d0ffc061a09c3345bf0.html MySQL ...

  2. 《全体育&#183;瑜伽》

    今天出去吃饭,本来是想买<印象>创刊号的,结果没找着,看到一本<瑜伽>创刊号.作为一个伪瑜伽爱好者,我掏了20元大洋买了一本,你知道如今的时尚杂志都非常坏,用塑料膜封着,不能翻 ...

  3. Android开发----------- 手电筒改进版本号

    在之前的基础上 在 res 目录以下: 加入一个 drawable/local_me.xml localme_cml <selector xmlns:android="http://s ...

  4. 利用@media screen实现网页布局的自适应,@media screen and

    开始研究响应式web设计,CSS3 Media Queries是入门.Media Queries,其作用就是允许添加表达式用以确定媒体的环境情况,以此来应用不同的样式表.换句话说,其允许我们在不改变内 ...

  5. 错 &#39;Cannot run program &quot;/home/uv/IDE/adt/sdk/platform-tools/adb&quot;: error=2, No such file or directory

    为linux平台搭建android开发环境的人,您可能会遇到问题,如下面有: 64位置linux安装64位置eclipse和64位置jdk开场后eclipse错误后 ""Canno ...

  6. 萧墙HTML5手机发展之路(51)——jquerymobile在提高页面访问速度

    正在使用jQuery Mobile开发时间可以选择单页模板和多页模板,在单页模板时从一个页面跳转到另一个页面时从需要server要求.用户会感到轻微的停顿. 使用多页模板,为了改善网页之间跳跃的流畅, ...

  7. 如何查看IC卡燃气表读数和剩余量?

    如今新建的楼房都是使用IC卡燃气表,拿到房子入住时也没有见到IC卡燃气表的使用说明书.非常多人可能为此而苦恼.这里就讲一下怎样查看IC卡燃气表读数及剩余金额. 产品外观 可选功能 watermark/ ...

  8. JAVA学习篇--Java类加载

    由来: 与普通程序不同的是,Java程序(class文件)并非本地的可执行程序(解释性语言). 当执行Java程序时.首先执行JVM(Java虚拟机),然后再把Javaclass载入到JVM里头执行, ...

  9. td中的值自动换行

    设置td中的值自动换行在<td ></td> 中加上这样一句代码,可以简省设置,使长字符串换行.而不用设置width,height. style="word-wrap ...

  10. 浅谈我对几个Web前端开发框架的比较

    强调一下,这篇日志主要还是针对想学前端开发的新朋友写的,不是说我有什么独特见解,而是比较客观的状态,就各种框架的异同和应用场合,需要注意的地方做简单描述,不做具体深入分析,有的地方比较抽象,对于抽象之 ...