Dreamweaver 8 超级链接和站点导航

合集下载

Dreamweaver 8中文版网页制作第5章创建超级链接

5.2.2
图像和图像热点超级链接

一、图像超级链接用图像作为链接载体，这就是图像超级链接。创建图像超级链接的方法是：首先选中图像，然后在【属性】面板中设置链接地址和目标窗口。
5.2.2
图像和图像热点超级链接
二、图像热点图像热点（或称图像热区、图像地图）实际上就是为图像绘制一个或几个特殊区域，并为这些区域添加链接。创建图像热点超级链接的方法是：（1）使用图像热点工具绘制热点区域。（2）在【属性】面板中设置链接地址、目标窗口等。
5.1.2
超级链接的分类
根据源端点的不同，超级链接也可分为3种类型。
文本超级链接：以文本作为超级链接载体。图像超级链接：以图像作为超级链接载体。表单超级链接：选择某个选项后会自动跳转到目标端点，或需要单击相应按钮会自动跳转到目标端点。
5.2 普通超级链接
本节主要内容：文本超级链接及其状态图像和图像热点超级链接图像地图电子邮件超级链接锚记超级链接
5.3.3 脚本链接
创建JavaScript链接的方法是，首先选定文本或图像，然后在【属性】面板的【链接】文本框中输入 “JavaScript:”，后面跟一些JavaScript代码或函数调用即可。
5.3.3 脚本链接
经常用到的脚本链接JavaScript代码。
JavaScript:alert('字符串') JavaScript:history.go(1)：前进 JavaScript:history.go(-1)：后退 JavaScript:history.forward(1)：前进 JavaScript:history.back(1)：后退 JavaScript:history.print()：打印 JavaScript:window.external.AddFavorite(‘htt p://’,‘老虎工作室’)：收藏指定的网页 JavaScript:window.close()：关闭窗口

中文版Dreamweaver8实用教程

中文版Dreamweaver 8实用教程
8.2.3 创建链接
在Dreamweaver 8中可以创建各种超链接。当在本地站点内移动或重命名文档或其他链接文件时，Dreamweaver 还可自动更新指向文档的链接。创建链接的类型和方法创建网页间超链接创建网页内的超链接创建E-Mail链接创建虚链接及脚本链接创建图形热点链接
中文版Dreamweaver 8实用教程
在Dreamwe在网页中创建超链接，首先选中要创建链接的对象。然后在该对象的属性检查器的“链接”文本框里输入要链接对象的URL或路径即可.
中文版Dreamweaver 8实用教程
中文版Dreamweaver 8实用教程
8.2.2 认识URL和链接路径
URL和链接路径的概念，以及它们之间相互的关系，是用户在设置网页超链接之前所必须要掌握的基本常识。 URL 绝对路径相对路径
中文版Dreamweaver 8实用教程
URL(Uniform Resoure Locator，统一资源定位器)指的是Internet文件在网上的地址，是使用数字和字母按一定顺序排列来确定的Internet地址，由访问方法、服务器名、端口号，以及文档位置组成。格式为Access-method :// server-name:port / document-location。比如/dw/index.htm，这是一个典型的URL，它指出使用http协议访问域名所在服务器下dw这个目录中的 index.htm文件。
中文版Dreamweaver 8实用教程
要创建图形热点链接，首先需要在文档窗口中选中插入的图像，然后使用图像属性检查器中的“地图名称”文本框和“热点工具”按钮在该图像中绘制热点区域。最后,选中所创建的热点区域后,在”热点”的属性检查器的”链接”文本框中输入链接目标的URL或路径即可.

Dreamweaver8网页超链接教学设计

ｐａｔｒｎｄｐｐｉａｉｎｓｆｗａｅａｈａｒｅ．Ｗｉｈｔｅ ” ｂｌｎｓａｘｍｐｅｏｔｓｇｔｅｃｕｓａｅｏｓｕｎｓｔｎａａｌｔｏｔｒｓｔｅｃｒｉｒｅｃｏｔｈｗｅｉｋ ” ｓｅａｌ．ｈｗｏｄｅｉｎｈｏｒｅｂｓｄｎｔｄｅｔ
３教学策略
本课内容的学习是一种自我需求下的获取，所以关键在于学习方法、学习习惯的培养。平时授课巾就
要注重倡导学生自主学习，碰到困难要想办法，通过
ＴｅｃｉｓｇｏｈｅＤｒａｗｅｖｒＷｅｎａｈｎｇＤｅｉｎｆｔｅｍａｅ８ｂＬｉｋｓ
ＧＵＡＮＬｌｉｉ
（ｉｎｊｎｉｌＨｓａｄｙ＆ＶｅｅｎｒｏａｉｎｌＣｌｇ，Ｈｅｌｎｊｎ１０１ＨｅｌｇｉｇＡｎｍａｕｂｎｒｏａｔｒａＶｃｔａｏｌｅｉｙｏｅｉｇｉｇ５１）ｏａ１
完成对知识点的学习与掌握．增强主动学习、探究的
意识。
信息链接实现的方法，让基础一般的学生能对
Ｄｅｍｗａｅ８中创建超链接的几种方法有个全面了ｒａｅｖｒ
解，能掌握其巾的部分内容，学会学习方法，为以后
２１０１年第２期
Ｄｒａｍｗｅｖｒｅａｅ８网页超链接教学设计

DW8网页链接与站点导航.

内部链接：即在同一个站点内的不同页面之间相互联系的超级链接。 Байду номын сангаас点链接：可以链接到网页中某个特定位置的链接。外部链接：把网页与Internet中的目标相联系的链接。
到电子邮箱的超级链接：用于链接到电子邮箱，可直接点击发送邮件。
到执行文件的超级链接：用于链接站点空间里的可执行程序，可用于下载跟再线运行。
Dreamweaver 应用技术——《 Dreamweaver MX
2004实训教程》讲义
一、创建超级链接
超级链接是web存在和发展的基础，正是超级链接的使用，才使普通的文本成为超文本，这种文本用html语言记录，在基于TCP/IP协议的网络上使用HTTP协议来传输，从而完成网络信息的交换。使用超级链接可以充分利用网络中的有用资源，例如：可以使站点资源的展示符合人们资源查询索取的基本习惯；可以使文本的组织更加有层次，符合人们的阅读习惯。在网页中超级链接根据链接目标的不同可分为5类。
(5) 重复步骤(4)（5）分别使“精美图片”、“书香天地”、“开心一笑”和“有缘即是朋友”字样jmtp.asp、sxtd.asp、kxyx.asp与sxtd.asp文件，建立超级链接，并设置打开方式为_self。
(6) 按下F12键浏览，单击任意设置超级链接的文字，都可跳转至对应网页，如单击【精美图片】字样，会自动跳转至【精美图片】网页，如右下图所示。
Dreamweaver 应用技术——《 Dreamweaver MX
2004实训教程》讲义
第8章网页中的文本对象
重点内容：
• 对不同载体设置越链接
• 通过CSS样式改变越链接样式 • 添加导航条
Dreamweaver 应用技术——《 Dreamweaver MX

Dreamweaver8教程

3.1.2 Dreamweaver 8的基本操作
4.预览网页效果选择“文件”|“在浏览器中预览”|“IExplore 6.0”
命令在IE浏览器中预览网页文档的效果，如图所示。
3.1.2 Dreamweaver 8的基本操作
5.退出Dreamweaver 8
单击Dreamweaver 8窗口右上角的“关闭”按钮。单击Dreamweaver 8窗口左上角的图标，在弹出的下拉菜单中
3.1 Dreamweaver8 3.2 网页文本及媒体的应用 3.3 表格的应用 3.4 3.5 超级链接 3.6 框架的应用 3.7 CSS样式的应用 3.8 层和行为的应用 3.9 时间轴的应用 3.10 表单的应用 3.11 模板的应用
3.1 Dreamweaver8简介
的，不能为中文名称）。 ⑵ 进入Dreamweaver8的工作界面。 ⑶ 选择“站点”|“新建站点”命令，弹出“未命名站点1的站点
定义为”对话框，如图所示。
3.1.3 Dreamweaver 8工作界面介绍
⑷ 在“站点名称”中输入站点名称“wangli”，在“本地根文件夹”中点击按钮，找到本地机上站点文件夹的位置，如图所示。
3.2.2 文本的编辑操作
⒉ 插入其他文本 ⑴ 插入水平线添加水平线在文档编辑区将插入点定位到所需位置。选择“插入”|“HTML”|“水平线”命令。单击“插入”栏中的“HTML” 按钮。修改水平线
初次绘制的水平线的格式往往不能满足实际需要，此时可通过“属性”面板对其进行修改，如图所示:
3.2.1 案例制作简单的“睡美人”网页
知识要点
创建网站站点制作简单网页修改页面、文本属性插入图像设置图像属性（实战步骤详见教材）

dw网页设计练习题答案

dw网页设计练习题答案一、填空题1、在Dreamweaver 编辑区中共有三种视图模式分别指的是代码视图、代码和设计视图和设计视图。

P92、deamweaver8默认的首页文件名是。

P163、搭建站点可以有两种方式，一是完成，二是P114、有两种设置deamweaver8站点的方法：一是使用向导完成，二是利用高级设定完成。

5、deamweaver的标题栏会显示、 P9.26、对多个网站进行管理是通过文件面板进行。

P18.47、初次启动Dreamweaver时，会弹出“工作区设置”对话框，供用户选择的有设计器和编码器工作区布局。

在这里选择默认的“设计器”就可以了。

P38、导航条可以存在4种状态，它们是状态图像、鼠标经过图像、按下时鼠标经过图像。

P52.59、META标记记录当前网页的相关信息，如P2710、头内容在浏览器中是不可见的，但却携带网页的重要信息，如关键字、描述文字等。

P2111、预览网页效果的快捷键是P2212、规划网站，一般要从三个方面去思考，即网站的主题、网站的内容和网站的对象。

13、页面的标题“音乐欣赏”是由HTML标签中的定义的。

14、网页中常用的图像格式有 GIF JPG PNG ，其中 GIF 格式支持动画格式。

二、单项选择题1、创建完全空白的静态页面应选择A. 基本页类别中的“HTML模板”选项B. 基本页类别中的“HTML”选项C. 动态页类别中的选项D. 入门页面中的选项2、下列不能在网页的“页面属性”中进行设置。

A.文档编码B.背景颜色、文本颜色、链接颜色C.网页背景图及其透明度D.跟踪图像及其透明度3、关于在Dreamweaver中插入Flash文本，说法错误的是A.可以设置Flash文本的动态效果，如淡入淡出等B.通过插入Flash文本，用户可以直接创建一个Flash 文本对象的动画C.可以设置Flash文本的字体、字号、文本颜色、鼠标转滚颜色等属性D.可以为Flash文本设置链接4、使用Dreamweaver创建网站的叙述，不正确的是A.站点的命名最好用英文或英文和数字组合B.网页文件应按照分类分别存入不同文件夹C.必须首先创建站点，网页文件才能够创建D.静态文件的默认扩展名为.htm或.html5、在IE浏览器中预览网页的快捷键是A.F9B.F10C.F11D.F126、对插入文件中的Flash动画，不能在属性面板中设置动画的属性。

Dreamweaver8教程

Dreamweaver8教程1、Flash透明化：插入Flash动画后，点击Flash图画，在属性中选择“参数”，在参数对话框左侧参数处填“wmode”，在右侧值的对应处填“transparent”，再点击“确定”即可。

2、设置滚动字幕：把光标插入点放在需要插入滚动字幕的地方，点击插入面板的“标签选择器”图标，选择“HTML标签”下的“页标签”中的“marquee”。

再转到代码视图，选择“窗口”——>“标签检查器”，在属性中单击未分类前面的“+”，可以在“标签检查器”中设置标签的各种用法。

点击“behavior”设置项右边的下拉箭头，选择滚动字幕内容的运动方式（“alternate”指内容在相反两个方向滚动，“scroll”指内容在同一方向滚动，“slide”指内容接触到字幕边框就停止滚动），direction属性设置字幕内容的滚动方向（down 向下滚动，left向左滚动，right向右滚动，up向上滚动），scrollamount属性设置字幕滚动的速度，scrolldelay属性设置字幕内容滚动时停顿的时间（单位毫秒），width属性设置字幕宽度，style属性设置字幕内容的样式，loop属性设置字幕内容滚动次数（默认或-1为无限）；在“行为”面板中，onMouseOver事件设置鼠标移动到滚动字幕时的动作（常设置为停止滚动），onMouseOut事件设置鼠标离开滚动字幕时的动作（常设置为开始滚动）。

（例:向上滚动字幕代码<marquee behavior=”scroll”direction=”up”width=”200”height=”150”loop=”-1”scrollamount=”1”scrolldelay=”1”style=”front:12px;”onMouseOver=”this.stop();” onMouseOut=”this.start();”>滚动字幕内容</marquee>3、插入关键字：（关键字用来帮助搜索引擎寻找网页的）选“插入”、“HTML”、“文件头标签”、“关键字”，在空白处输入关键字（多个关键字之间用逗号隔开）。

dreamweaver8.0入门图文教程：Dreamweaver 8 操作

dreamweaver8.0入门图文教程：Dreamweaver 8 操作环境第一天的内容可能让你觉得枯燥乏味，不过，“工欲善其事，必先利其器”，让我们一起来了解Dreamweaver8的操作环境，完成站点的创建。

一、Dreamweaver8 的操作环境在首次启动Dreamweaver8时会出现一个“工作区设置”对话框，在对话框左侧是Dreamweaver8的设计视图，右侧是Dreamweave 8的代码视图。

Dreamweaver8设计视图布局提供了一个将全部元素置于一个窗口中的集成布局。

我们选择面向设计者的设计视图布局。

在Dreamweave 8 中首先将显示一个起始页，可以勾选这个窗口下面的“不在显示此对话框”来隐藏它。

在这个页面中包括“打开最近项目”、“创建新项目”“从范例创建”3个方便实用的项目，建议大家保留。

新建或打开一个文档，进入Dreamweaver8的标准工作界面。

Dreamweaver8的标准工作界面包括：标题显示、菜单栏、插入面板组、文档工具栏、标准工具栏、文档窗口、状态栏、属性面板和浮动面板组。

1、标题显示栏启动Macromedia Dreamweave 8后，标题栏将显示文字Macromedia Dreamweave 8.0，新建或打开一个文档后，在后面还会显示该文档所在的位置和文件名称。

2、菜单栏Dreamweave 8的菜单共有10个，即文件、编辑、视图、插入、修改、文本、命令、站点、窗口和帮助。

其中，编辑菜单里提供了对Dreamweaver菜单中[首选参数]的访问。

文件：用来管理文件。

例如新建，打开，保存，另存为，导入，输出打印等。

编辑：用来编辑文本。

例如剪切，复制，粘贴，查找，替换和参数设置等。

查看：用来切换视图模式以及显示、隐藏标尺、网格线等辅助视图功能。

插入：用来插入各种元素，例如图片、多媒体组件，表格、框架及超级链接等。

修改：具有对页面元素修改的功能，例如在表格中插入表格，拆分、合并单元格，对其对象等。

第2走进Dreamweaver 8及站点管理

站点的规划
• Dreamweaver 8的站点类型 • 规划站点结构 • 绘制网站结构草图
Dreamweaver 8的站点类型
• 本地站点 • 远程站点
• 测试站点
规划站点结构
规划站点结构是设计站点的必要前提，其操作是将不同的文件分类存放在文件夹中以便于设计者管理。合理地组织站点结构，可提高工作效率，加快对站点的设计。
Dreamweaver 8 中文版网页制作基础
主讲人
第 2讲
走进Dreamweaver 8及站点建立
1、启动与退出 2、工作界面 3、创建简单页面 4、定义站点 5、管理站点 6、用站点管理文件.
1、启动与退出
1．启动 2．退出 3.打开网页文档 4.关闭网页文档
1.1. 启动
删除站点
窗口中执行【站点】/【管理站点】命令，打开【管理站点】对话框，在【管理站点】对话框的站点列表中选中“我的相册”，直接单击右侧的“删除”按钮即可。
复制站点
打开【管理站点】对话框，选中要复制的站点，然后单击“复制” 按钮，如图1所示，那么在【管理站点】对话框的站点列表中就复制了一个该站点的副本，如图2所示。
工作界面
2.1．窗口介绍
在默认状态下，Dreamweaver 8窗口主要有标题栏、菜单栏、文档工具栏、编辑区、【属性】面板、插入栏、面板组、状态栏等组成，如上图所示。
• • •
标题栏：显示当前正在编辑的文档的目录和名称。菜单栏：菜单栏位于标题栏的下面，有10个菜单组成，包含了几乎所有的Dreamweaver8命令。文档工具栏：文档工具栏中包含按钮，使用这些按钮可以在文档的不同视图间快，还包含一些与查看文档、在本地和远程站点间传输文档有关的常用命令和选项，如图所示。

dreamweaver8网页设计第六章使用超链接和行为

1．“弹出信息”行为弹出信息”
有时候，我们在打开某个网页或单击网页中的某个元素时可以看到弹出信息框。应用“弹出信息” 行为可以轻松实现该功能，本节我们就来看看 “弹出信息”行为的应用。
2．“设置状态栏文本”行为设置状态栏文本”
所谓“状态栏文本”，就是在网页运行时浏览器下方的状态栏中显示的文本。好多个人网站都设置了状态栏文本，以表达网站主人的心声。本节我们来看看如何为网页设置状态栏文本。
6.1.3 设置图片链接和下载链接
所谓图片链接，就是在单击网页中的某个小图片时在新窗口中打开一幅大图片；下载链接是指单击某个超链接时会打开一个“文件下载”对话框（或自动启动下载工具），通过在该对话框中单击“打开”或“保存”按钮，可以打开或下载文件。
6.1.4 设置电子邮件链接
很多网站上留有电子邮件地址，单击该地址可打开“Outlook Express”的“新邮件”窗口，这是一种特殊类型的链接，又叫电子邮件链接。
综合实例2 综合实例2—为“SM”网站主页添加伴随窗 SM” 口
本例将在综合实例1中制作好的“index.html”网页文档的基础上，为网站主页添加伴随窗口。
“行为”面板是应用行为所不可缺少的工具，本节来认识一下“行为”面板。选择“窗口”>“行为”菜单，或按【Shift+F4】组合键，即可打开 “行为”面板。
6.2.3 应用行为
如果要对某个对象应用行为，需要先选中该对象，然后单击“行为”面板上方的“添加行为”按钮，在打开的行为列表中选择动作，并在打开的窗口中设置效果，最后指定设定的动作在什么情况下发生，也就是指定事件。
3．“打开浏览器窗口”行为打开浏览器窗口”
应用“打开浏览器窗口”行为，可实现单击目标文字或图片打开固定大小窗口的效果。许多站点都使用这种方式来弹出重要的通知、广告信息等页面。

Dreamweaver8 ppt教程第06章

♦ 下面介绍常用的三种文档路径类型： ♦ 绝对路径：绝对路径就是被链接文档的完整URL，包括所使用的传输
协议（对于网页通常是http://）。（从一个网站的网页链接到另一个网站的网页）时，必须使用绝对路径，能保证当一个网站的网址发生变化，被引用令一个页面的链接还是有效的。例如（/support/dreamw eaver /contents.html）。 ♦ 文档相对路径：以以前文档所在位置为起点到被连接文档经由的路径。这是用于本地链接最适宜的路径。例如，dreamweaver/contents.htm就是一个文档相对路径。当用户要把当前文档与处在相同文件夹中的另一文档链接，或把同一网站下不同文件夹中的文档相互链接时，就可以使用相对路径。 ♦ 根相对路径：根相对路径是指从站点根文件夹到被链接文档经由的路径。一个根相对路径以前斜杠开头，它代表站点根文件夹。例如， /support/tips.html就是站点根文件夹下的support子文件夹中的一个文件（tips.html）的根相对路径。根相对路径是指定网站内文档链接的最好方法，因为在移动一个包含相对链接的文档时，无需对原有的链接进行修改。
6.1.1URL概述 6.1.2相对路径和绝对路径 6.1.3在Web上使用链接 6.2创建超级链接 6.2.1创建文本链接导航 6.2.2创建E-mail链接 6.2.3创建图像热点链接 6.2.4创建下载文件的链接网页 6.3创建锚点链接网页 6.3.1插入命名锚记 6.3.2创建命名锚记链接 6.4实战演练 6.4.1 范例1 创建图像映射网页 6.4.2 范例2 创建空链接 6.5 思考与练习
6.2.1创建文本链接导航
生变化，通常鼠标会变成一个小手。同时文本也发生了一些变化（出现下划线、文本颜色发生变化、字体发生改变等）。此时单击鼠标，会打开文本所链接的网页，这就是文本超级链接。创建文本超级链接导航通常有4种方法。 ♦ 1．使用【属性】面板创建链接 ♦ 2．指向文件图标创建链接 ♦ 3．快捷菜单创建链接 ♦ 4．使用菜单命令

快速上手使用Dreamweaver进行网站导航和链接

快速上手使用Dreamweaver进行网站导航和链接第一章：认识DreamweaverDreamweaver是Adobe公司开发的一款专业网页设计软件，它具有强大的编辑和设计功能，能够帮助用户轻松地创建和编辑网页。

通过使用Dreamweaver，用户可以方便地管理网站的导航和链接。

第二章：创建网站导航栏要创建一个有效的网站导航栏，首先需要打开Dreamweaver软件并创建一个新的HTML文档。

接下来，选择“插入”菜单中的“导航栏”选项。

在弹出的“导航栏”对话框中，可以选择不同的导航栏样式，也可以根据需要进行自定义设置。

在设置完成后，点击“确定”按钮即可生成导航栏。

第三章：编辑网站导航栏生成导航栏后，可以通过双击导航栏进行编辑。

在编辑模式下，可以根据需要添加、删除或修改导航栏中的链接和按钮。

可以通过选择按钮来更改其外观，调整按钮的大小和位置，并更改按钮上显示的文本。

如果需要添加子菜单，可以在按钮上右键单击并选择“添加子菜单”选项。

通过编辑导航栏的设置，可以实现更加个性化的导航栏效果。

第四章：设置网站链接在Dreamweaver中设置网站链接非常简单。

首先需要选择要添加链接的文字或图像，并点击工具栏中的“链接”按钮。

在弹出的“链接”对话框中，可以选择链接的类型。

例如，可以将链接设置为跳转到其他网页、网站内的锚点或电子邮件地址。

在对话框中还可以设置链接的目标窗口和链接的标题等属性。

设置完成后，点击“确定”按钮即可创建链接。

第五章：管理网站导航和链接除了创建和编辑导航栏和链接外，Dreamweaver还提供了其他功能来管理网站导航和链接。

例如，可以使用“站点管理器”功能来管理整个网站的导航和链接。

在站点管理器中，可以查看和编辑网站的目录结构，并针对不同的页面设置导航和链接。

此外，Dreamweaver还提供了一些检查链接有效性的工具，可以帮助用户快速定位和解决链接错误。

第六章：优化网站导航和链接为了提高用户体验和网站的可用性，有几个技巧可以帮助优化网站的导航和链接。

Dreamweaver8教程(三)

Dreamweaver8.0创建模板在我们制作网站的过程中，为了统一风格，很多页面会用到相同的布局、图片和文字元素。

为了避免大量的重复劳动，可以使用Dreamweaver8提供的模板功能，将具有相同版面结构的页面制作为模板，将相同的元素（如导航栏）制作为库项目，并存放在库中可以随时调用。

一、创建模板模板的创建有三种方式。

1、直接创建模板选择“窗口/资源”命令，打开“资源”面板，切换到模板子面板，如下图所示。

单击模板面板上的“扩展”按钮，在弹出菜单中选择“新建模板”这是在浏览窗口出现一个未命名的模板文件，给模板命名。

然后单击“编辑”按钮，打开模板进行编辑。

编辑完成后，保存模板，完成模板建立。

2、将普通网页另存为模板打开一个已经制作完成的网页，删除网页中不需要的部分，保留几个网页共同需要的区域。

选择“文件/另存为模板”命令将网页另存为模板。

在弹出的“另存模板”对话框中，“站点”下拉列表框用来设置模板保存的站点，课选择一个选项。

“现存的模板”选框显示了当前站点的所有模板。

“另存为”文本框用来设置模板的命名。

单击“另存模板”对话框中的“保存”按钮，就把当前网页转换为了模板，同时将模板另存到选择的站点。

单击“保存”按钮，保存模板。

系统将自动在根目录下创建Template文件夹，并将创建的模板文件保存在该文件夹中。

在保存模板时，如果模板中没有定义任何可编辑区域，系统将显示警告信息。

我们可以先单击“确定”，以后再定义可编辑区域。

3、从文件菜单新建模板选择“文件/新建”命令，打开“新建文档”对话框，然后再类别中选择“模板页”，并选取相关的模板类型，直接单击“创建”按钮即可。

Dreamweaver8.0定义可编辑区域模板创建好后，要在模板中建立可编辑区，只有在可编辑区里，我们才可以编辑网页内容。

可以将网页上任意选中的区域设置为可编辑区域，但是最好是基于HTML代码的，这样在制作的时候更加清楚。

在文档窗口中，选中需要设置为可编辑区域的部分，单击常用快捷栏的“模板”按钮，在弹出菜单中选择“可编辑区域”项。

第7章 Dreamweaver 8的基本应用

桂林电子科技大学信息科技学院信息工程系
7.5 超级链接与导航栏
关于选择被链接文档要打开的位置：关于选择被链接文档要打开的位置： _blank 在新的未命名的浏览器窗口中加载链接文档。在新的未命名的浏览器窗口中加载链接文档。
_parent 在父框架页或包含该链接的框架窗口中加载链接文档。在父框架页或包含该链接的框架窗口中加载链接文档。如果包含链接的框架不是嵌套的，则链接文档将加载到整如果包含链接的框架不是嵌套的，个浏览器窗口中。个浏览器窗口中。 _self （默认）默认） _top 将在整个浏览器窗口中加载链接文件，同时移除所有框架。将在整个浏览器窗口中加载链接文件，同时移除所有框架。将链接文档加载到与链接相同的框架或窗口中。将链接文档加载到与链接相同的框架或窗口中。
桂林电子科技大学信息科技学院信息工程系
7.3 网页的基本属性
桂林电子科技大学信息科技学院信息工程系
7.3.3 保存网页文档 7.3.4 浏览网页的运行效果可在文档工具栏中的“标题”栏目中的文本框中输入网可在文档工具栏中的“标题” 页的标题，在浏览器运行时将显示在网页的标题栏上。页的标题，在浏览器运行时将显示在网页的标题栏上。在文档工具栏中，找到一个球体的预览图标，点一下出在文档工具栏中，找到一个球体的预览图标，来一个下拉列表，选择所使用的浏览器，如“IExplore 来一个下拉列表，选择所使用的浏览器， 6.0”,便可以启动浏览器， 6.0”,便可以启动浏览器，查看所制作的网页在浏览器中便可以启动浏览器运行的效果。运行的效果。
桂林电子科技大学信息科技学院信息工程系
7.4 页面文本的格式化
二、应用CSS样式应用CSS样式 1.应用于当前文档： 1.应用于当前文档：应用于当前文档 1）选择要使用该样式的对象，如某些文字。选择要使用该样式的对象，如某些文字。 2）展开属性面板中的“样式列表”。其中可见当前文展开属性面板中的“样式列表” 档中所有可用的样式。如图7-33 档中所有可用的样式。如图7 3）单击所要应用的样式名称，这里是“css-1”，即可单击所要应用的样式名称，这里是“css-1”，将所选中的样式应用于所选择的对象。将所选中的样式应用于所选择的对象。

创建超链接和导航

文档相对路径就是指包含当前文档的文件夹，也就是以当前网页所在文件夹为基础来计算的路径。
中文版Dreamweaver 8基础与上机实训
6.2 创建链接
Dreamweaver 8可以为对象、文本或图像创建超链接，以链接到其他文档或文件，或链接到单个文档的指定位置。当在本地站点内移动或重命名文档或其他链接文件时，Dreamweaver 可自动更新指向文档的链接。
用户可以通过在“文件”面板中添加、更改和删除链接来修改站点的结构。Dreamweaver 8会自动更新“文件”面板以显示对站点所做的更改。
中文版Dreamweaver 8基础与上机实训
6.5 思考与练习
填空题
。
2. URL指的是，它使用以确定一个地址，由
、
、
以及
组成。
3.在Dreamweaver 8中，可以创建下列5种类型的链接，分别是、、、和。
中文版Dreamweaver 8基础与上机实训
创建空链接和脚本链接
空链接实际上是一个未设计的链接，用于激活页面上的对象或文本。一旦对象或文本被激活，当鼠标指针经过该链接时，用户可为其附加行为以交换图片或显示层。要创建空链接，用户只需在选定文字或图片后，在属性检查器的“链接”下拉列表框中输入javascript:; (javascript 一词后依次接一个冒号和一个分号)，或是一个“#”号。
❖ 创建链接的类型和方法 ❖ 创建页间超链接 ❖ 创建页内超链接 ❖ 创建E-mail链接 ❖ 创建空链接和脚本链接 ❖ 创建图形热点链接
中文版Dreamweaver 8基础与上机实训
创建链接的类型和方法
在Dreamweaver 8中，可以创建下列几种类型的链接。页间超链接：用于跳转到其他文档或文件，如图形、电影、PDF或声音文件。页内超链接：也被称为锚记链接，用于跳转到本站点指定文档的位置。 E-mail链接：用于启动电子邮件程序，允许用户编辑电子邮件，并发送到指定地

《网站设计与制作》试卷和答案

第一部分应知考试题库2.1.2网页制作基础1．填空题（1）网页一般分为（）网页和（）网页。

（2）HTML是（）的缩写，意思为（）。

（3）网页主要由（）、（）、（）、超链接等基本元素构成。

（4）常用的制作网页的专门工具有（）和（）。

（5）如果属性面板被隐藏了，可以通过执行（）菜单下的“属性”命令来打开。

2．选择题（1）下面文件属于静态网页的是______。

A.index.aspB.index.jspC.index.htmlD.index.php（2）属于网页制作工具的是______。

A.photoshopB.flashC.dreamweaverD.cuteFTP（3）用于调整编辑窗口中被选中元素的属性的面板是_____A.插入面板B.属性面板C.设计面板D.文件面板（4）在网页中经常用的两种图像格式是_______。

A.bmp和jpgB.gif和bmpC.png和bmpD.gif和jpg（5）下列说法正确的是_____。

A.动态网页使用应用程序解释器但不使用后台数据库B.动态网页不使用应用程序解释器但使用后台数据库C.动态网页不使用应用程序解释器也不使用后台数据库D.动态网页使用应用程序解释器也使用后台数据库2.1.3网站的创建与管理1．选择题（1）如果正在编辑的文件没有存盘，系统在文件名上加上____符号提示用户。

A.!B.C.#D.*（2）在“资源面板”中没有列出的资源是______。

A.文本B.图像C.颜色D.脚本（3）保存网页文档的快捷键是__________。

A.Ctrl+AB.Ctrl+SC.Ctrl+WD.Ctrl+N（4）下列哪一种视图不属于―文件面板‖中视图列表中的视图类型A.本地视图B.地图视图C.远程视图D.大纲视图（5）定义站点时，存放网页的默认文件夹为__________。

A.C盘根目录B.D盘根目录C.我的文档D.没有默认文件夹，必须由用户指定2.1.4页面的整体控制1．选择题（1）打开页面属性对话框，使用_______功能键。

Dreamweaver_8_简介及站点的管理与建立[1]

华南农业大学现代教育技术中心
认识Dreamweaver 8的工作界面
进入Dreamweaver 8的工作界面，并显示Dreamweaver 8的开始页。
华南农业大学现代教育技术中心
Dreamweaver 8 开始页中各部分的作用
• “打开最近栏目”栏：在该栏中列出了最近编辑过的文件，单击即可打开相应文件。单击“打开” 链接可以弹出“打开”对话框，用于选择要打开的文件。 “创建新栏目”栏：单击该栏中的一个超级链接，即可创建相应类型的项目文件。 “从范例创建”栏：单击该栏中的一个超级链接，即可按照范例创建相应类型的项目文件。 “扩展”栏：单击“Dreamweaver Exchange”超级链接，即可启动浏览器并打开 Dreamweaver的扩展插件页面。
华南农业大学现代教育技术中心
Dreamweaver 8的安装
8．开始安装：安装向导开始安装程序，并显示安装的进度。
华南农业大学现代教育技术中心
Dreamweaver 8的安装
9．安装完成：安装完毕后打开“完成”对话框，单击“完成”按钮即可完成 Dreamweaver 8的安装。
华南农业大学现代教育技术中心
华南农业大学现代教育技术中心
Dreamweaver 8的安装
6．打开“默认编辑器”对话框：在其中选择Dreamweaver 8 默认编辑的文件类型。建议保持不变，单击“下一步”按钮。
华南农业大学现代教育技术中心
Dreamweaver 8的安装
7．打开“已做好安装程序的准备”对话框：再打开的“已做好按装程序的准备” 对话框中单击“安装”按钮。
WEB界面开发
Dreamweaver+HTML+CSS网站界面设计

DW8网页链接与站点导航

Dreamweaver 应用技术——《 Dreamweaver MX
2004实训教程》讲义
一、创建超级链接
(3) 选中“悠然而过”二字，单击属性面板上的【指向文件】按钮，并按住鼠标左键不放，拖动鼠标指向站点窗口中的yreg.asp文件，如左下图所示，为“悠然而过” 字样建立超级链接。
(4) 打开【目标】下拉列表框，从中选择_self选项。
（1）为文字添加超级链接选择面页中需要添加超级链接的文字，在属性面板上的【链接】文本框中指定文字的链接目标。在【目标】下拉列表框中选择目标文件打开的方式(此项必须在【链接】文本框中加入了目标路径后，才变为可用状态)。当设置这两项后，在网页中被选择的文字颜色变为蓝色，且在文字底部出现一条下划线，即文字的超级链接设置完成。在键盘上按F12键，即可将网页在浏览器中打开。单击链接的文字，即可打开指定的目标文件。
Dreamweaver 应用技术——《 Dreamweaver MX
2004实训教程》讲义
一、创建超级链接
根据超级链接链接对象的不同（即载体），可分为2类。
文本链接：用文本作链接载体，简单实用。
图像链接：用图像作为链接载体能使网页美观、生动活泼，它既可以指向单个的链接，也可以根据图像不同的区域建立多个链接。
Dreamweaver 应用技术——《 Dreamweaver MX
2004实训教程》讲义
一、创建超级链接
（2）为图片添加超级链接为图片添加超级链接的操作步骤与为文字相似。下面通过一个实例介绍使用图片创建超级链接的方法。 (1) 打开站点中存在的文件yreg.asp，选择其中的卡通图片。 (2) 拖动【属性】面板上的【指向按钮】，指向站点窗口中ytp.asp文件，为整张图片设置超级链接。 (3) 在【替代】文本框中输入“单击大图可查看原始图像”。 (4) 单击【属性】面板中的【多边形热点工具】按钮，围绕着“花”单击，最后双击完成热点圈选，如右下图所示。 (5) 选择圈选的热点，拖动【属性】面板上的【指向按钮】，指向站点窗口中 hhj.asp文件，为圈选的花设置超级链接。 (6) 在【替代】文本框中输入“单击此外可查看更多花束”。

Dreamweaver 8 超级链接和站点导航

Dreamweaver 8中文版网页制作第5章 创建超级链接

中文版Dreamweaver8实用教程

Dreamweaver8网页超链接教学设计

DW8网页链接与站点导航.

Dreamweaver8教程

dw网页设计练习题答案

Dreamweaver8教程

dreamweaver8.0入门图文教程：Dreamweaver 8 操作

第2走进Dreamweaver 8及站点管理

dreamweaver8网页设计 第六章 使用超链接和行为

Dreamweaver8 ppt教程 第06章

快速上手使用Dreamweaver进行网站导航和链接

Dreamweaver8教程(三)

第7章 Dreamweaver 8的基本应用

创建超链接和导航

《网站设计与制作》试卷和答案

Dreamweaver_8_简介及站点的管理与建立[1]

DW8网页链接与站点导航

Dreamweaver 8中文版网页制作第5章创建超级链接

dreamweaver8网页设计第六章使用超链接和行为

Dreamweaver8 ppt教程第06章