Dreamweaver3完全教程(21)
全套教程打包下载
编辑网页的头部内容
我们已经知道,一个HTML文件,通常由包括在<head>和</head>标记间的头部,和包括在<body>和</body>标记的正文两个部分组成。文档的标题信息就存储在HTML的头部位置,在浏览页面时,它会显示在浏览器的标题栏,当将页面放入浏览器的“收藏夹”时,文档的标题又会作为收藏夹中项目的名称。
除了标题之外,头部还可以包括很多非常重要的信息,例如文档的类型、语言的解码方式、JavaScript和VBScript的函数和变量,以及针对每个引擎的关键字和内容指示符等。
一般来说,不需要输入全部的头部内容。但是最好为文档设置标题和解码方式信息,养成良好的创作习惯。
要往文档的头部添加信息,您可以按照如下方法进行操作:
如果在文档窗口中,没有显示头部内容,可以打开“View”(查看)菜单,选择“Head
Content”(头部内容)命令,显示文档的头部内容。
在对象面板上,打开其上的下拉菜单,选择“Head”(头部),显示同HTML头部相关的对象按钮,如图 3-19所示。
图 3-19 对象面板上的头部元素按钮
要插入某种元素,可以单击相应的按钮,这时会出现一个对话框。
输入需要的信息,确定操作,即可往文档的头部添加数据。
如果希望编辑头部信息,可以在文档窗口的头部窗格单击选中相应的标记,然后在属性面板上修改。
注意:除了使用对象面板之外,也可以通过打开“Insert”(插入)菜单,选择“Head”(头部),再选择相应的命令来实现头部元素的插入。为了说明简单,我们后面将只使用对象面板来插入头部元素。
认识头部元素
元数据(meta data)是HTML头部的主要组成部分主要用于表示一个文档的页面信息,这些信息可以被计算机识别,用于某些特定的场合。在HTML中,元数据的表现方式是多种多样的。
除了元数据之外,在HTML头部还可以包含其他类型的标记,例如<base>标记和<link>标记等,我们都在后面进行介绍。
<meta>标记
<meta>标记是实现元数据的主要标记,它能够提供文档的关键字、作者、描述等多种信息,在HTML的头部可以包括任意数量的<META>标记。
<meta>标记是非封闭类型的标记,它包括如下几种属性:
name = string
name属性用于定义一个元数据属性的名称,其中string是用于表示名称的字符串。
content = cdata
content属性用于定义元数据的属性值,其中cdata表示相关数据。
scheme = cdata
scheme属性说明用于解释元数据属性值的机制,其中cdata表示相关数据。
http-equiv = string
http-equiv属性可以用于替代name属性,HTTP服务器可以使用该属性来从HTTP响应头部收集信息,其中string是用于表示名称的字符串。
charset = encoding
charset属性用于定义文档的字符解码方式,其中encoding表示解码方式。
在HTML规范中,并没有硬性指定的属性标准,因此用户可以自行定义元数据。
例如,可以采用如下语句定义作者信息。
<meta name = "author"
content = "周明涛">
有些搜索引擎使用关键字(keywords)和描述(description)来进行搜索。这时,在文档中可以提供如下语句:
<meta name = "keywords"
content = "周明涛, 微文工作室, Zhou Mingtao, Microtext">
<meta name = "description"
content = "微文工作室周明涛制作的主页">
<base>标记
<base>标记定义了文档的基础URL地址,在文档中所有的相对地址形式的URL都是相对于这里定义的URL而言的。一篇文档中的<base>标记不能多于一个,必须放于头部,并且应该在任何包含URL地址的语句之前。
<base>包含如下的属性:
href = url
href属性指定了文档的基础URL地址。该属性在<base>标记中是必须存在的。
例如,如果希望将文档的基础URL定义为“http://www.microsoft.com”,则可以使用如下语句:
<base href = "http://www.microsoft.com">
当定义了基础URL地址之后,文档中所有引用的URL地址都从该基础URL地址开始,例如,对于上面的语句,如果文档中一个超级链接指向china/document.html,则它实际上指向的是如下URL地址:
http://www.microsoft.com/china/document.html
target = frameset
target属性同框架一起使用,它定义了当文档中的链接被点击后,哪一个框架集中展开页面。如果文档中超级链接没有明确指定展开页面的目标框架集,则就使用这里定义的地址代替。
其中frameset可以被设置如下的值,请参看表 3-2。
表 3-2 target的属性值
属性值 |
含义 |
_blank |
表明在新窗口中展开链接指向的页面 |
_self |
在当前文档的框架集中展开页面 |
_parent |
在当前文档的父级框架集中展开页面 |
_top |
在链接所在的完整窗口中展开页面 |
<link>标记
<link>标记定义了文档之间的包含。在HTML的头部可以包含任意数量的<link>标记。有些浏览器并不能很好处理link属性,因此不建议使用它。
<link>标记带有很多属性,下面是一些常用的属性:
href = url
href属性指向链接资源所在的URL,其中url是链接的地址。
title = string
title属性用于描述该链接关系。其中string是描述关系的字符串。
rel = linktype
rel属性定义了文档和所链接资源的链接关系,其中,linktype表明链接类型,可能的值包括Alternate,Stylesheet,Start,Next,Prev,Contents,Index,Glossary,Copyright,Chapter,Section,Subsection,Appendix,Help,和Bookmark等。如果希望指定不止一个链接关系,可以在这些值之间用空格隔开。
rev = linktype
rev属性定义了文档和所链接资源之间的反向关系。其中linktype表明链接类型,其可能的取值同rel属性相同。
插入元数据
利用Dreamweaver可以很方便地插入任意类型的元数据,您可以按照如下方法进行操作:
单击对象面板上的下拉列表,选择“Head”(头部)。
单击对象面板上的“Insert Meta”(插入元数据)按钮。
这时会出现如图 3-20所示的对话框,提示您输入元数据。
图 3-20 插入元数据
Attribute(属性) 在该下拉列表中,可以选择两种类型的属性:name和http-equiv。
Value(值) 在该文本框中,可以输入属性值。
Content(内容) 在该文本框中,可以输入属性内容。
设置完毕,按下“OK”按钮,确定操作。
图 3-20所示的情形实际上输入的是如下的代码:
<meta name="author"
content="周明涛">
在这里也可以指定文档的解码方式,例如,要将文档的解码方式设置为中文简体,可以在“Attribute”(属性)下拉列表中选择“http-equiv”,在“Value”文本框中输入“Content-Type”,在“Content”(内容)文本框中输入“text/html;
charset=gb2312”即可。这实际上是输入了如下的代码:
<meta http-equiv="Content-Type"
content="text/html; charset=gb2312">
如果希望编辑插入的元数据,可以首先显示文档的头部窗格,单击元数据标记,即可在属性面板上进行编辑,如图
3-21所示。

图 3-21 选中元数据时的属性面板
插入关键字
关键字信息仍然属于元数据的范畴,但是由于它经常被使用,Dreamweaver额外定义了相应的插入命令,允许直接插入关键字属性。
您可以按照如下方法操作:
单击对象面板上的“Insert Keywords”(插入关键字)按钮。
这时会出现如图 3-22所示的对话框,允许您输入关键字信息。

图 3-22 插入关键字
输入相应的关键字信息,多个关键字之间可以使用逗号隔开。
按下“OK”按钮,确定操作。
图 3-22显示的操作,实际上等同于输入了如下语句:
<meta name="keywords"
content="周明涛,微文工作室">
要编辑关键字信息,可以从文档的头部窗格中,选中关键字标记,然后在属性面板上修改,如图
3-23所示。

图 3-23 编辑关键字时的属性面板
插入描述信息
描述信息也属于元数据的范畴,Dreamweaver单独提供了插入描述信息的方法,您可以按照如下步骤进行操作:
单击对象面板上的“Insert Description”(插入描述)按钮。
这时会出现一个对话框,提示您输入描述信息,该对话框同图 3-22所示的对话框类似。
输入描述信息。
按下“OK”按钮确定操作。
该操作相当于输入如下的语句,其中content的值就是这里输入的描述信息。
<meta name="description"
content="微文工作室周明涛的主页">
要编辑描述信息,可以从文档的头部窗格中,选中描述标记,然后在属性面板上修改。
定义自动刷新
您可以为网页设置自动刷新特性,让它在被浏览器显示时,隔一段指定的时间,然后跳转到某个页面或是重新刷新自身。
您可以按照如下步骤进行操作:
单击对象面板上的“Insert Refresh”(插入刷新)按钮,这时会出现如图
3-24所示的对话框。

图 3-24 定义刷新特性
在“Delay...seconds”(隔...秒)文本框中,可以输入网页刷新的间隔时间。
在“Action”(动作)区域可以设置刷新的动作,您可以指定在指定的时间间隔到达后跳转到某个页面上,或是仅仅重新在浏览器中刷新自身。
设置完毕,按下“OK”按钮,确定操作。
自动刷新特性目前已经被越来越多的网页所使用。例如,可以首先在一个页面上显示欢迎信息,经过一段时间,自动跳转到指定的网页上。另外一种使用自动刷新特性的原因是网站地址的迁移,这时可以首先在原先网址的主页上显示新的网址信息,以通知访问旧网址的用户,然后经过一段时间,自动跳转到新地址上。
图 3-24的设置实际上添加了如下的语句,我们可以看到,它仍然是元数据的一种表现形式。
<meta http-equiv="refresh"
content="10;URL=www.microsoft.com">
要编辑自动刷新设置,可以从文档的头部窗格中,选中刷新标记,然后在属性面板上修改,如图
3-25所示。
注意:需要展开属性面板看到定义延迟时间的文本框。

图 3-25 设置自动刷新时的属性面板
设置基础URL地址
如果希望为文档中的URL设置基础URL地址,可以按照如下方法进行操作:
单击对象面板上的“Insert Base”(插入基础)按钮,这时会出现如图
3-26所示的对话框。

图 3-26 插入基础URL地址
在“Href”文本框中输入基础URL地址,也可以单击“Browse”按钮,选择基础地址路径,这实际上设置的是<base>标记的href属性。
在“Target”下拉列表框中,可以选择链接文档在哪个框架集中被打开,这实际上设置的是<base>标记的target属性值。
设置完毕,按下“OK”按钮,确定操作。
图 3-26操作实际上生成的是如下语句:
<base href="www.microsoft.com"
target="_parent">
要编辑基础URL地址,可以从文档的头部窗格中,选中基础标记,然后在属性面板上修改,如图
3-27所示。

图 3-27 编辑URL基础时的属性面板
设置文档链接
使用<link>标记可以定义文档和引用资源之间的链接关系。在Dreamweaver中,可以通过如下方法实现:
单击对象面板上的“Insert Link”(插入链接)按钮,这时会打开如图
3-28所示的对话框。

图 3-28 设置文档链接关系
在“Href”文本框中输入链接资源所在的URL地址,或单击“Browse”按钮从磁盘或网络上选择,这里实际上设置的是<link>标记的href属性。
在“ID”文本框中输入ID值,这实际上设置的是<link>标记的ID属性。
在“Title”文本框中输入对该链接的描述,这里实际上设置的是<link>标记的title属性。
在“Rel”和“Rev”文本框中输入文档同链接资源的链接关系,这里实际上设置的是<link>标记的rel属性和rev属性。
设置完毕,按下“OK”按钮,确定操作。
图 3-28的设置实际上输入了如下语句:
<link href="file:///C|/WINNT/Web/Tip.htm"
id="Tip" rel="Alternate" rev="Alternate"
title="Tips">
要编辑链接关系,可以从文档的头部窗格中,选中链接标记,然后在属性面板上修改,如图
3-29所示。

图 3-29 编辑链接关系时的属性面板