原文：http://www.cnblogs.com/sunyunh/archive/2012/07/25/2609199.html

HTML（3）HTML文档头部信息

 
  1.  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  <html xmlns="http://www.w3.org/1999/xhtml">
  3.  <head>
  4.      <!--指定HTML文档的标题，注意：不要忘记结束标签里面的反斜杠“/”，否则整个页面将不会显示-->
  5.      <title>博客园 - 程序员的网上家园</title>
  6.      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  7.      <meta name="keywords" content="博客园,开发者,程序员,软件开发,编程,代码,极客,Developer,Programmer,Coder,Code,Coding,Greek,IT学习" />
  8.      <meta name="description" content="博客园是面向程序员的高品质IT技术学习社区，是程序员学习成长的地方。博客园致力于为程序员打造一个优秀的互联网平台，帮助程序员学好IT技术，更好地用技术改变世界。" />
  9.      <link rel="shortcut icon" href="http://static.cnblogs.com/favicon.ico" type="image/x-icon" />
  10.      <link rel="Stylesheet" type="text/css" href="http://common.cnblogs.com/css/reset.css" />
  11.      <link rel="Stylesheet" type="text/css" href="http://common.cnblogs.com/blog/css/sitehome.css?id=20120616" />
  12.      <link id="RSSLink" title="RSS" type="application/rss+xml" rel="alternate" href="http://www.cnblogs.com/rss" />
  13.      <script src="http://common.cnblogs.com/script/jquery.js" type="text/javascript"></script>
  14.      <script src="http://common.cnblogs.com/blog/script/site.js?id=20120616" type="text/javascript"></script>
  15.  </head>
  16.  <body>
  17.  </body>
  18.  </html>

　　以上代码定义了一个HTML文档，其中<head></head>标签对中间的部分为该HTML文档的头部信息，<head></head>标签对之间的内容是不会在浏览器的“文档”窗口中显示出来的。根据 HTML 标准，仅有几个标签在 HTML 的头部分是合法的，它们包括：<base>, <link>, <meta>, <title>, <style> 和 <script>。

　　1. <!DOCTYPE> 标签：

　　以上示例代码的第一行便是<!DOCTYPE>标签。现在互联网上所有的网页都有<!DOCTYPE>标签的定义。

　　DTD(Document Type Definition)—文档类型定义， 是一套关于标记符的语法规则。doctype 声明不属于 HTML 标签（tag）; 它是一条指令，告诉浏览器编写页面所用的标记的版本。在所有 HTML 文档中规定 doctype 是非常重要的，这样浏览器就能了解预期的文档类型。

　　HTML 4.01 规定了三种文档类型：Strict、Transitional 以及 Frameset，分别表示严格版本、过渡版本以及基于框架的 HTML 文档。

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

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

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

　　第一种：HTML Strict DTD， 严格版本的文档类型定义。如果您需要干净的标记，免于表现层的混乱，请使用此类型。请与层叠样式表（CSS）配合使用：

  1.  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "
  2.  http://www.w3.org/TR/html4/strict.dtd">

　　第二种：HTML Transitional DTD， 过度版本的文档类型定义，Transitional DTD 可包含 W3C 所期望移入样式表的呈现属性和元素。如果您的读者使用了不支持层叠样式表（CSS）的浏览器以至于您不得不使用 HTML 的呈现特性时，请使用此类型：

  1.  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "
  2.  http://www.w3.org/TR/html4/loose.dtd">

　　第三种：Frameset DTD ，基于框架的HTML文档类型定义。Frameset DTD 应当被用于带有框架的文档。除 frameset 元素取代了 body 元素之外，Frameset DTD 等同于 Transitional DTD：

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

参考地址：http://www.w3school.com.cn/tags/tag_doctype.asp

　　2.文档标题：

　　在HTML文档中，文档标题用<title></title>标签对来表示。<title>标签中间的文本元素就是该页面的标题，当用户在浏览器中浏览时，该文本就会显示在用户浏览器的标题栏中了。对于标题的内容，如果是网站的主页，则可以用网站的名称来作为该页面的标题。如果是普通的页面，则多以表述该页面功能的字词作为页面的标题内容。需要注意的是，在写标题的结束标签的时候，不要忘记反斜杠“/”，否则可能导致整个页面无法显示。这是我以前犯过的一个错误，当页面写完之后在浏览器中浏览，页面是空白的，最后才发现是少了</title>中的反斜杠。

　　3.<meta>标签：

　　<meta> 元素可提供有关页面的元信息（meta-information），比如网站页面的编码、关键词和对网站的描述信息等内容。<meta> 标签必须位于文档的头部（head标签内），它是HTML文档中head区的一个辅助性标签，标签内部不包含任何内容。<meta> 标签的属性定义了与文档相关联的“名称/值”对。

　　<meta>标签共有两个属性，它们分别是http-equiv属性和name属性，不同的属性又有不同的参数值，这些不同的参数值就实现了不同的网页功能。比如通过name属性的keywords 和 description属性就可以设置网站关键词，对网站进行SEO优化。

　　<meta>标签在HTML 与 XHTML 之间的差异 ：在 HTML 中，<meta> 标签没有结束标签。 在 XHTML 中，<meta> 标签必须被正确地关闭。

　　<meta name=“名字” content=“值” />  --name属性是关于网页的描述信息。 　　<meta http-equiv="名字" content="值" /> --http-equiv属性用于模拟http响应头信息。　　

　　例如：
　　a.指定网页编码:
　　<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />  --指定网页使用utf-8编码
　　或者
　　<meta content="text/html; charset=gb2312" http-equiv="Content-Type"/> --指定网页使用gb2312编码
　　b.刷新/重定向网页：
　　<meta http-equiv="Refresh" content="3" /> 三秒钟后刷新此网页。
　　<meta http-equiv="Refresh" content="3;url=http://www.cnblogs.com" />  三秒钟后重定向到content属性的url从那时所指定的新网页。
　　c.设置页面缓存：
　　<meta http-equiv=“Cache-Control” content=“no-cache” />  禁止浏览器缓存页面。
　　d.网页关键词和页面的描述信息：
　　<meta name=“keywords” content=“博客园,程序员,八卦”/> 网站关键词
　　<meta name=“description” content=”博客园是最适合DotNet开发人员的技术家园”/> 描述信息
　　4.<link>标签：
　　<link>元素用于将外部的CSS文件引入页面，比如：
　　 <link rel="shortcut icon" href="http://static.cnblogs.com/favicon.ico" type="image/x-icon" />
　　需要注意的是：<link>元素设置路径是使用href属性，这个需要和下面的<script>标记的src属性区分开来，我在一次面试中被考到，但当时我忘记了。必须同　　　　　　　　　　      要为<link>元素指定 type属性和rel属性。
　　5.<script>标签：
　　位于<head>标签中的<script>标签，是用来引入外部的js文件。比如：
 　　<script src="http://common.cnblogs.com/blog/script/site.js?id=20120616" type="text/javascript"></script>　
　　该标签需要指定“src” 属性和“type”属性。
　　注意：在引入外部JS文件的时候，是通过上面这种方式实现的（使用</scipt>作为结束标记)，不能将它改为下面直接以反斜杠结束的形式：
　　 <script src="http://common.cnblogs.com/blog/script/site.js?id=20120616" type="text/javascript"/>
　　这样页面就找不到所引用的JS文件了。
　　此外，我们还可以在<head>标签中定义属于某一个页面自己的CSS和JS，但是现在已经为了做到标记结构和页面的样式相分离，更好的方式是将CSS和JS定义为单独的文件，然后通过<link>标签和<script>标签来引入到HTML页面。
　　6.<base>标签　　

　　<base> 标签用于为页面上的所有链接规定默认地址（URL）或默认目标（target）。通常情况下，浏览器会从当前文档的 URL 中提取相应的元素来填写相对 URL 中的空白。使用 <base> 标签可以改变这一点。浏览器随后将不再使用当前文档的 URL，而使用指定的基本 URL 来解析所有的相对 URL。这其中包括 <a>、<img>、<link>、<form> 标签中的 URL。

  1.  <html>
  2.  <head>
  3.  <base href="http://www.w3school.com.cn/i/" />
  4.  <base target="_blank" />
  5.  </head>
  6.  <body>
  7.  <img src="eg_smile.gif" /><br />
  8.  <p>请注意，我们已经为图像规定了一个相对地址。由于我们已经在 head 部分规定了一个基准 URL，浏览器将在如下地址寻找图片：</p>
  9.  <p>"http://www.w3school.com.cn/i/eg_smile.gif"</p>
  10.  <br /><br />
  11.  <p><a href="http://www.w3school.com.cn">W3School</a></p>
  12.  <p>请注意，链接会在新窗口中打开，即使链接中没有 target="_blank" 属性。这是因为 base 元素的 target 属性已经被设置为 "_blank" 了。</p>
  13.  </body>
  14.  </html>
奔跑！狮子赶不上最慢的羚羊就会饿死；羚羊跑不过最快的狮子就会被吃掉！

(转)HTML文档头部信息的更多相关文章

  1. 关于文档头部定义和meta元素

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. IT兄弟连 HTML5教程 HTML文档头部元素head

    HTML头部标记是<head>,主要包括页面的一些基本描述语句,以及CSS和JavaScript,一般都可以定义在头部元素中.它用于包含当前文档的有关信息,例如网页标题和关键字等.通常位于 ...

  3. OC自定义文档头部注释

    1.创建文件 IDETemplateMacros.plist 2.向文件里添加内容 具体内容 // 文 件 名:___FILENAME___ // // 版权所有:___COPYRIGHT___ // ...

  4. pycharm新建py文件时，自动补充文件头注释信息

    步骤: 1.File -->Settings 2.选择 File and Code Templates -> Files -> Python Script 文件头注释信息代码样式: ...

  5. 《Javascript权威指南》学习笔记之十九--HTML5 DOM新标准---处理文档元信息和管理交互能力

    一.了解DOM 1.DOM是Document Object Model的缩写,即文档对象类型,是文档在内存中的表示形式,是一个应用程序接口,定义了文档的逻辑结构以及一套訪问和处理文档的方法. 2.HT ...

  6. Nginx优化_数据包头部信息过大问题

    如果客户端发出请求的URL头部信息过大,网站将不能及时响应,并通过状态码414报错. <center><h1>414 Request-URI Too Large</h1& ...

  7. 大家的备忘录——xpage_在同一页面展开文档显示该文档详细信息（可显示处理过的Rich Text）

    Xpage大纲: 解析: 1.通过[link2]点击触发jQuery事件来展开[面板:thispanel] 2.[面板:thispanel]写了onClientLoad事件:让thispanel隐藏. ...

  8. [玩转微信平台]XML的格式化- 如何去掉XML 文档头和命名空间

    前言 系统要求能够回复微信用户发过来的文本消息.实现中使用的实体对象进行XML的序列化的方式来实现XML消息.   微信平台的回复例子 http://mp.weixin.qq.com/wiki/14/ ...

  9. hibernate文档头的不同版本

    <!DOCTYPE hibernate-mapping PUBLIC "-//Hibernate/Hibernate Mapping DTD 3.0//EN" "h ...

随机推荐

  1. android 内存泄露之jni local reference table overflow (max=512)

    在android项目中要实现一个需求 为了性能的要求只能用c代码来实现功能. 这样就牺牲了java跨平台性. 通过加载.so的方式,把用c实现的模块集成到app中. android提供jni层,作为一 ...

  2. linux笔记：linux系统安装-linux系统安装

    1.进入BIOS设置界面(在vmware虚拟机环境下,点击“虚拟机”菜单——电源——启动到BIOS设置): 2.把硬盘启动改成光盘启动(把光标移动到Boot菜单,再把光标置于CD-ROM Drive上 ...

  3. 修改IIS文件上传大小限制

    如果要上传的文件比较大,则需在IIS中修改文件上传的大小限制,否则无法上传(表现为程序不报错,而上传进度到100%后没有反应). 点击"管理"下的"配置编辑器" ...

  4. CentOS中输入yum报错：sudo: unable to execute /bin/yum: No such file or directory

    今天尝试更新了下虚拟机CentOS中的python版本后. 运行“yum”命令,就报错:“sudo: unable to execute /bin/yum: No such file or direc ...

  5. ccs6.0使用问题记录

    ccs6.0使用问题记录 彭会锋 1 编译过程中提示warning  " Description Resource Path Location Type #9-D nested commen ...

  6. nodeschool.io 3

    ~~ MY FIRST I/O! ~~ Write a program that uses a single synchronous filesystem operation toread a fil ...

  7. hdu-----(1179)Ollivanders: Makers of Fine Wands since 382 BC.(二分匹配)

    Ollivanders: Makers of Fine Wands since 382 BC. Time Limit: 2000/1000 MS (Java/Others)    Memory Lim ...

  8. HDUOJ----1234 开门人和关门人（浙江大学考研题）

    开门人和关门人 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)Total Sub ...

  9. Java List的深度克隆

    关于java List的深度克隆 List是java容器中最常用的顺序存储数据结构之一.有些时候我们将一组数据取出放到一个List对象中,但是可能会很多处程序要读取他或者是修改他.尤其是并发处理的话, ...

  10. java 分析方法调用过程

    StackTraceElement[] s = new Exception().getStackTrace(); for(int i=0;i<s.length;i++) System.out.p ...