c++语言课程第5讲 超链接
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
Dreamweaver 8
中文版网页制作基础
主讲人 :王雪峰
第五讲 超级链接
1. 路径
2. 超链接的属性
3. 链接的种类 4. 图像地图超链接
•
什么是超链接：所谓的超链接是指从一个对象指向另一个对象的链接关系， 源对象可以是文本、图像、按钮等，目标对象可以是一个页面、一张图片、 一个文件、一个邮件地址或者一个应用程序等等。
中进行具体的设置，如下图所示。
2.1文本超链接
• 首先选中文本，在【常用】插入栏单击插入超链接按钮，打开【超级 链接】对话框，在【文本】文本框中输入超链接文本，在【链接】选 项框输入目标网页名称或者单击按钮选择目标文件，在【目标】选项 框的列表中选择打开目标的位置，在【标题】文本框输入相关文本， 如下图所示
2.2．图像超链接
• 单击选中一个图片，在【属性】面板中单击【链接】文本框后的按钮 ， 如图1，打开【选择文件】对话框，如图2，找到目标文件 “Description001.html”，然后单击“确定”按钮 ，为图像创建超链接 完成，最终的【属性】面板显示如图3所示 。
3、超链接的种类
1．按路径分类 2．按性质分类 3. 锚记链接 4．热点链接 5. 电子邮件链接
image
beijing.jpg
② 相对于根目录
/mysite/image/beijing.jpg
(第一个“/”代表根目录，因此 “/im源自文库ge/beijing.jpg”代表根目录下image文件夹 下的beijing.jpg文件)
mysite
sub1 Index.html
image
beijing.jpg
•内部链接
创建指向其他页面的链接，就是在当前页面与其 他相关页面间建立超链接。无论目标文件与当前文件 的目录关系如何，其格式为： <A href = "目标文件的路径/目标文件名.html"> 热点 </A> 根据目标文件与当前文件的目录关系，有4种写法： ① 链接到同一目录内的网页文件，其格式为： <A href="目标文件名.html"> 热点 </A> 目标文件名是链接所指向的文件。
3.1．按路径分类
根据链接对象的路径不同，可以分为：内部链接、外部 链接和锚记链接。 • 内部链接：链接到当前网站内的其他网页，上一节所列举 的两个例子都是内部链接。 • 外部链接：链接到网站外的其他网页，在【链接】文本框 输入完整的地址，如链接到搜狐网站首页，则要输入 “http://www.sohu.com”。 • 锚记链接：链接到当前打开的网页中某个指定位置。
先选中目标，在属性面板添 加电子邮件地址。
单击含有电子邮件链接的目 标，自动打开邮件软件
② name指定当前文档内的一个字符串作为链接时 可以使用有效的目标资源的地址。 ③ target设定链接被按后结果所要显示的窗口。 可选值为：_blank，_parent，_self，_top，框架名 称。其说明见表2-6。
表2-6 target属性的取值
取值 说明
target="_blank"或 将链接的画面内容，开在新的浏览器窗口中。 target="new" target="_parent" target="_self" target="_top" 将链接的画面内容，显示在直接父框架窗口中。 将链接的画面内容，显示在当前窗口中（默认值）。 将框架中链接的画面内容，显示在没有框架的窗口中（即 除去了框架）。
② 链接到下一级目录中的网页文件，其格式为： <A href="子目录名/目标文件名.htm"> 热点 </A> ③ 链接到上一级目录中的网页文件，其格式为： <A href="../目标文件名.html"> 热点 </A> 其中“../”表示退到上一级目录中。 ④ 链接到同级目录中的网页文件，其格式为： <A href="../子目录名/目标文件名.html"> 热点 </A> 表示先退到上一级目录中，然后再进入到目标文 件所在的目录。
•
当鼠标光标移到添加了超链接的对象上时，光标就变成了小手状如图1，在超 链接对象上单击后，链接目标将被打开或者运行，如图2。在默认状态下，如 果为文本添加了超链接后，那么该文本就显示为蓝色字体且带有下划线，用 于与普通文本区别，单击后文本的颜色又会发生改变。用户也可以在页面属 性里修改链接的显示状态。
1.路径
路径的作用就是定位一个文件的位置，文件和文件夹本
身就是路径的概念。分为相对路径和绝对路径。 ① 相对于当前目录 ./image/beijing.jpg (“.”代表当前目录，
mysite sub1
因此 “./image”代表
当前目录下image 的文件夹,“./”是可以省略的）
Index.html
3.4．热点链接
• 热点链接又叫图像映射，它是指将一个图片划成多个区域， 每个区域链接到不同的对象上去。当浏览者单击映射图时， 浏览器会自动判断鼠标单击在哪个热点上，并根据判断跳 转到相应的对象上去 。
3.5．电子邮件链接
电子邮件链接是指连接到E-mail地址的链接。如果用户的 机器已经安装了Outlook、Foxmail等邮件软件，在浏览网页 时单击一个E-mail地址链接就会自动打开一个邮件发送窗口， 并且地址栏已经自动添加了链接的E-mail地址。
③ 相对于上级目录
../image/beijing.jpg
(“../”代表上级目录，因此 “/image/beijing.jpg”代表 上级目录下image文件夹下的beijing.jpg文件)
mysite sub1
sub2
image
beijing.jpg
Index.html
1.1. 热点(超链接)标记
【超级链接】对话框中需要设置的各项的含义。
【文本】文本框：在页面中显示的带有超链接的文本，
【链接】选项框：单击超链接后将要跳转到的目标对象。 【目标】选项框：目标对象的打开位置：_bank代表在一个新的窗口中打
开链接对象；_self表示在当前窗口打开链接对象，它是系统的默认值；
_parent和_top都表示在一个完整的窗口打开链接目标。 【标题】文本框：鼠标光标移到超链接文本上时显示的文字
target="框架名称" 只运用于框架中，若被设定则链接结果将显示于该“框架 名称”指定的框架窗口中，框架名称是事先由框架标记所 命名的。
2、超链接默认属性
• 默认情况下，带超链接的文本显示为蓝色，且带有下划线，用户可以 自行设置不同的显示状态。在【属性】面板单击按钮，打开【页面属 性】对话框，在【分类】栏单击【链接】项，然后在右侧具体的项目
热点由<A>标记定义，它在网页上建立超文本链接。 通过单击一个词、句或图片，可从此处转到另一个链 接资源（目标资源），这个目标资源有唯一的地址 （URL）。具有以上特点的词、句或图片就称为热点。 <A>标记的格式为： <A href=地址 name=字符串 target=打开窗口方式> 热点 </A> 说明： ① href为超文本引用，它的值为一个URL，是目 标资源的有效地址。在书写URL时要注意，如果资源放 在自己的服务器上，可以写相对路径。否则，应写绝 对路径。href不能与name同时使用。
超链接（Hyperlink）可以看作是一个“热点”，它可以从 当前Web页定义的位置跳转到其他位置，包括当前页的某个位置、 Internet或本地硬盘或局域网上的其他文件，甚至跳转到声音、 图片等多媒体文件。浏览Web页是超链接最普遍的一种应用，通 过超链接还可以获得不同形态的服务，如文件传输、资料查询、 电子函件、远程访问等。 当Web页包含超链接时，Web页中的外观形式为彩色（一般为 蓝色）且带下划线的文字或图片。单击这些文本或图片，可跳转 到相应位置。鼠标指针指向超链接的显示文本或图片时，将变成 手形。超文本链接使用热点标记<A>来定义。
① ② ③ ④ 热点链接：链接指向一张图片的某一部分。 电子邮件链接：链接指向一个E-mail地址。 多媒体文件链接：链接指向一个多媒体文件。 空链接：链接不指向任何目标文件，一般用“#”代替。
3.3．锚记链接
通过建立锚 记链接，直 接跳转到指 定的位置。
•命名锚记
要在当前页面内实现超链接，需要定义两个标记： 一个为超链接标记，另一个为书签标记。超链接标记 的格式为： <A href="#记号名"> 热点 </A> 单击热点文本，将跳转到“记号名”开始的文本。 书签就是用<A>标记对该文本作一个记号。如果有 多个链接，不同目标文本要设置不同的书签名，书签 名在<A>的name属性中定义。格式为： <A name=“记号名”> 目标文本附近的字符串 </A>
• 外部链接
• 链接到网站外的其他网页，在【链接】文本框输入完整的地址，如链 接到搜狐网站首页，则要输入“http://www.sohu.com”。
3.2．按性质分类
根据链接对象的性质不同，链接又可分为：文本链接、 图像链接、电子邮件链接、多媒体文件链接和空链接等。 其中的文本链接和图像链接是大家比较常用的链接，需 要特别说明一点的是图像链接的一个特例：热点链接。
中文版网页制作基础
主讲人 :王雪峰
第五讲 超级链接
1. 路径
2. 超链接的属性
3. 链接的种类 4. 图像地图超链接
•
什么是超链接：所谓的超链接是指从一个对象指向另一个对象的链接关系， 源对象可以是文本、图像、按钮等，目标对象可以是一个页面、一张图片、 一个文件、一个邮件地址或者一个应用程序等等。
中进行具体的设置，如下图所示。
2.1文本超链接
• 首先选中文本，在【常用】插入栏单击插入超链接按钮，打开【超级 链接】对话框，在【文本】文本框中输入超链接文本，在【链接】选 项框输入目标网页名称或者单击按钮选择目标文件，在【目标】选项 框的列表中选择打开目标的位置，在【标题】文本框输入相关文本， 如下图所示
2.2．图像超链接
• 单击选中一个图片，在【属性】面板中单击【链接】文本框后的按钮 ， 如图1，打开【选择文件】对话框，如图2，找到目标文件 “Description001.html”，然后单击“确定”按钮 ，为图像创建超链接 完成，最终的【属性】面板显示如图3所示 。
3、超链接的种类
1．按路径分类 2．按性质分类 3. 锚记链接 4．热点链接 5. 电子邮件链接
image
beijing.jpg
② 相对于根目录
/mysite/image/beijing.jpg
(第一个“/”代表根目录，因此 “/im源自文库ge/beijing.jpg”代表根目录下image文件夹 下的beijing.jpg文件)
mysite
sub1 Index.html
image
beijing.jpg
•内部链接
创建指向其他页面的链接，就是在当前页面与其 他相关页面间建立超链接。无论目标文件与当前文件 的目录关系如何，其格式为： <A href = "目标文件的路径/目标文件名.html"> 热点 </A> 根据目标文件与当前文件的目录关系，有4种写法： ① 链接到同一目录内的网页文件，其格式为： <A href="目标文件名.html"> 热点 </A> 目标文件名是链接所指向的文件。
3.1．按路径分类
根据链接对象的路径不同，可以分为：内部链接、外部 链接和锚记链接。 • 内部链接：链接到当前网站内的其他网页，上一节所列举 的两个例子都是内部链接。 • 外部链接：链接到网站外的其他网页，在【链接】文本框 输入完整的地址，如链接到搜狐网站首页，则要输入 “http://www.sohu.com”。 • 锚记链接：链接到当前打开的网页中某个指定位置。
先选中目标，在属性面板添 加电子邮件地址。
单击含有电子邮件链接的目 标，自动打开邮件软件
② name指定当前文档内的一个字符串作为链接时 可以使用有效的目标资源的地址。 ③ target设定链接被按后结果所要显示的窗口。 可选值为：_blank，_parent，_self，_top，框架名 称。其说明见表2-6。
表2-6 target属性的取值
取值 说明
target="_blank"或 将链接的画面内容，开在新的浏览器窗口中。 target="new" target="_parent" target="_self" target="_top" 将链接的画面内容，显示在直接父框架窗口中。 将链接的画面内容，显示在当前窗口中（默认值）。 将框架中链接的画面内容，显示在没有框架的窗口中（即 除去了框架）。
② 链接到下一级目录中的网页文件，其格式为： <A href="子目录名/目标文件名.htm"> 热点 </A> ③ 链接到上一级目录中的网页文件，其格式为： <A href="../目标文件名.html"> 热点 </A> 其中“../”表示退到上一级目录中。 ④ 链接到同级目录中的网页文件，其格式为： <A href="../子目录名/目标文件名.html"> 热点 </A> 表示先退到上一级目录中，然后再进入到目标文 件所在的目录。
•
当鼠标光标移到添加了超链接的对象上时，光标就变成了小手状如图1，在超 链接对象上单击后，链接目标将被打开或者运行，如图2。在默认状态下，如 果为文本添加了超链接后，那么该文本就显示为蓝色字体且带有下划线，用 于与普通文本区别，单击后文本的颜色又会发生改变。用户也可以在页面属 性里修改链接的显示状态。
1.路径
路径的作用就是定位一个文件的位置，文件和文件夹本
身就是路径的概念。分为相对路径和绝对路径。 ① 相对于当前目录 ./image/beijing.jpg (“.”代表当前目录，
mysite sub1
因此 “./image”代表
当前目录下image 的文件夹,“./”是可以省略的）
Index.html
3.4．热点链接
• 热点链接又叫图像映射，它是指将一个图片划成多个区域， 每个区域链接到不同的对象上去。当浏览者单击映射图时， 浏览器会自动判断鼠标单击在哪个热点上，并根据判断跳 转到相应的对象上去 。
3.5．电子邮件链接
电子邮件链接是指连接到E-mail地址的链接。如果用户的 机器已经安装了Outlook、Foxmail等邮件软件，在浏览网页 时单击一个E-mail地址链接就会自动打开一个邮件发送窗口， 并且地址栏已经自动添加了链接的E-mail地址。
③ 相对于上级目录
../image/beijing.jpg
(“../”代表上级目录，因此 “/image/beijing.jpg”代表 上级目录下image文件夹下的beijing.jpg文件)
mysite sub1
sub2
image
beijing.jpg
Index.html
1.1. 热点(超链接)标记
【超级链接】对话框中需要设置的各项的含义。
【文本】文本框：在页面中显示的带有超链接的文本，
【链接】选项框：单击超链接后将要跳转到的目标对象。 【目标】选项框：目标对象的打开位置：_bank代表在一个新的窗口中打
开链接对象；_self表示在当前窗口打开链接对象，它是系统的默认值；
_parent和_top都表示在一个完整的窗口打开链接目标。 【标题】文本框：鼠标光标移到超链接文本上时显示的文字
target="框架名称" 只运用于框架中，若被设定则链接结果将显示于该“框架 名称”指定的框架窗口中，框架名称是事先由框架标记所 命名的。
2、超链接默认属性
• 默认情况下，带超链接的文本显示为蓝色，且带有下划线，用户可以 自行设置不同的显示状态。在【属性】面板单击按钮，打开【页面属 性】对话框，在【分类】栏单击【链接】项，然后在右侧具体的项目
热点由<A>标记定义，它在网页上建立超文本链接。 通过单击一个词、句或图片，可从此处转到另一个链 接资源（目标资源），这个目标资源有唯一的地址 （URL）。具有以上特点的词、句或图片就称为热点。 <A>标记的格式为： <A href=地址 name=字符串 target=打开窗口方式> 热点 </A> 说明： ① href为超文本引用，它的值为一个URL，是目 标资源的有效地址。在书写URL时要注意，如果资源放 在自己的服务器上，可以写相对路径。否则，应写绝 对路径。href不能与name同时使用。
超链接（Hyperlink）可以看作是一个“热点”，它可以从 当前Web页定义的位置跳转到其他位置，包括当前页的某个位置、 Internet或本地硬盘或局域网上的其他文件，甚至跳转到声音、 图片等多媒体文件。浏览Web页是超链接最普遍的一种应用，通 过超链接还可以获得不同形态的服务，如文件传输、资料查询、 电子函件、远程访问等。 当Web页包含超链接时，Web页中的外观形式为彩色（一般为 蓝色）且带下划线的文字或图片。单击这些文本或图片，可跳转 到相应位置。鼠标指针指向超链接的显示文本或图片时，将变成 手形。超文本链接使用热点标记<A>来定义。
① ② ③ ④ 热点链接：链接指向一张图片的某一部分。 电子邮件链接：链接指向一个E-mail地址。 多媒体文件链接：链接指向一个多媒体文件。 空链接：链接不指向任何目标文件，一般用“#”代替。
3.3．锚记链接
通过建立锚 记链接，直 接跳转到指 定的位置。
•命名锚记
要在当前页面内实现超链接，需要定义两个标记： 一个为超链接标记，另一个为书签标记。超链接标记 的格式为： <A href="#记号名"> 热点 </A> 单击热点文本，将跳转到“记号名”开始的文本。 书签就是用<A>标记对该文本作一个记号。如果有 多个链接，不同目标文本要设置不同的书签名，书签 名在<A>的name属性中定义。格式为： <A name=“记号名”> 目标文本附近的字符串 </A>
• 外部链接
• 链接到网站外的其他网页，在【链接】文本框输入完整的地址，如链 接到搜狐网站首页，则要输入“http://www.sohu.com”。
3.2．按性质分类
根据链接对象的性质不同，链接又可分为：文本链接、 图像链接、电子邮件链接、多媒体文件链接和空链接等。 其中的文本链接和图像链接是大家比较常用的链接，需 要特别说明一点的是图像链接的一个特例：热点链接。