超级链接PPT课件
合集下载
HTML超链接课件

HTML
超 链 接
1.超链接基本知识。 2.超链接的建立方法。
3.内部链接、书签链接、外部链接。
超链接基本知识
1. 超链接 超文本链接(hypertextlink)通常简称为 超链接(hyperlink),或者简称为链接(link )。链接是HTML 的一个最强大和最有价值 的功能。链接是指文档中的文字或者图像与另 一个文档、文档的一部分或者一幅图像链接在 一起。
more.html 文件的代码如下:
<html> <head> <title>目标窗口的打开方式</title> </head> <body> <center><h2>影片详情</h2></center> <font size=4>《孤岛》The Island</font><br><br> 男青年林肯· 6E(伊万· 迈克格雷戈)生活在 一个貌似乌托邦、却被21 世纪中叶先进的科学技术设备武装起来的社区 里。<br> 但是,不久后的一个意外让林肯惊觉:原来 ,他头脑中一切关于自己身世和整个这个社区的认识都是一个巨大的谎 言!他和社区里的所有居民其实都是“神秘岛”居民们的克隆人,他们 的存在只是为了给他们的“原型”提供各种更换用的身体零件,而这个 社区其实只是个软禁他们的牢笼……<br> </body> </html>
target值
_parent _blank
超 链 接
1.超链接基本知识。 2.超链接的建立方法。
3.内部链接、书签链接、外部链接。
超链接基本知识
1. 超链接 超文本链接(hypertextlink)通常简称为 超链接(hyperlink),或者简称为链接(link )。链接是HTML 的一个最强大和最有价值 的功能。链接是指文档中的文字或者图像与另 一个文档、文档的一部分或者一幅图像链接在 一起。
more.html 文件的代码如下:
<html> <head> <title>目标窗口的打开方式</title> </head> <body> <center><h2>影片详情</h2></center> <font size=4>《孤岛》The Island</font><br><br> 男青年林肯· 6E(伊万· 迈克格雷戈)生活在 一个貌似乌托邦、却被21 世纪中叶先进的科学技术设备武装起来的社区 里。<br> 但是,不久后的一个意外让林肯惊觉:原来 ,他头脑中一切关于自己身世和整个这个社区的认识都是一个巨大的谎 言!他和社区里的所有居民其实都是“神秘岛”居民们的克隆人,他们 的存在只是为了给他们的“原型”提供各种更换用的身体零件,而这个 社区其实只是个软禁他们的牢笼……<br> </body> </html>
target值
_parent _blank
跳转从超链接开始课件

现在老师带大家一起领略中国的大好河山,让我们做 一个小游戏——“比比谁最快!”请同学们打开素材 文件夹中的“领略中国的大好河山.pptx”,老师说出 一个名胜景点的名字,同学们找到这个景点图片所在 的幻灯片,看谁找到的最快。找到了立即举起手示意 并说出幻灯片的编号。
情境导入
几轮后,老师宣布上半场游戏结束,表扬优胜者并询 问:你是用什么方法这么快找到的? 你的方法有没有什么遗憾或不足之处? 宣布现在游戏反转,一位同学说出景点的名字,老师 来找幻灯片。(老师用设置了超链接目录和插入动作 按钮的幻灯片游戏。
做课前准备工作参入游戏思考:幻灯片页面间的灵活 跳转的方法。 1.导入课题及学习目标。 2.展示超链接的功能。 3.全体同学参入游戏,引发思考,激发学生学习兴趣。
情境导入
【观看视频学习新知】 师:什么是超链接呢?请同学们观看视频并思考: 1.一个完整的超链接包括哪两个部分? 教师总结:建立超链接的载体(对象)和链接的目标。
学生分析
学生对超链接可以说是既熟悉又陌生, 熟悉是因为他们经常接触网页中的超 链接,陌生是因为他们不知道超链接 是怎么做出来的。 PowerPoint 中的超 链接与网页中的超链接基本一样,链 接源基本相同,一般都是文字或图片, 只是链接目标稍有差异。教学中可以 通我们已经储备了超链接的知识, 下面就可以大展身手了。 1.观看视频了解超链接并汇报结果。 2.阅读《导学案》中的学习材料自主探 究在PPT中如何确定超链接的载 体和 目标,并汇报结果。 1.了解超链接的含义及超链接的两个部 分。 2.探究在PPT 中建立超链接的对象和超 链接的目标及实现的功能。为实 践活 动打下理论基础
情境导入
【阅读学习材料自主探究】 师:请同学们阅读《导学案》中的学习材料自主探究: 1.在 PPT中建立超链接的对象有哪些? 2.在 PPT中超链接的目标有哪些? 教师总结: 链接源:文字、文本框、图片等超链接的目标: (1)本文档中的某一张幻灯片。(实现页面灵活跳 转—提高运行效率) (2)外部资源: 【1】其他 PPT文档或其他程序的文档; 【2】网址; 【3】电子邮件地址。(整合多种媒体信息—增强承载 能力)
情境导入
几轮后,老师宣布上半场游戏结束,表扬优胜者并询 问:你是用什么方法这么快找到的? 你的方法有没有什么遗憾或不足之处? 宣布现在游戏反转,一位同学说出景点的名字,老师 来找幻灯片。(老师用设置了超链接目录和插入动作 按钮的幻灯片游戏。
做课前准备工作参入游戏思考:幻灯片页面间的灵活 跳转的方法。 1.导入课题及学习目标。 2.展示超链接的功能。 3.全体同学参入游戏,引发思考,激发学生学习兴趣。
情境导入
【观看视频学习新知】 师:什么是超链接呢?请同学们观看视频并思考: 1.一个完整的超链接包括哪两个部分? 教师总结:建立超链接的载体(对象)和链接的目标。
学生分析
学生对超链接可以说是既熟悉又陌生, 熟悉是因为他们经常接触网页中的超 链接,陌生是因为他们不知道超链接 是怎么做出来的。 PowerPoint 中的超 链接与网页中的超链接基本一样,链 接源基本相同,一般都是文字或图片, 只是链接目标稍有差异。教学中可以 通我们已经储备了超链接的知识, 下面就可以大展身手了。 1.观看视频了解超链接并汇报结果。 2.阅读《导学案》中的学习材料自主探 究在PPT中如何确定超链接的载 体和 目标,并汇报结果。 1.了解超链接的含义及超链接的两个部 分。 2.探究在PPT 中建立超链接的对象和超 链接的目标及实现的功能。为实 践活 动打下理论基础
情境导入
【阅读学习材料自主探究】 师:请同学们阅读《导学案》中的学习材料自主探究: 1.在 PPT中建立超链接的对象有哪些? 2.在 PPT中超链接的目标有哪些? 教师总结: 链接源:文字、文本框、图片等超链接的目标: (1)本文档中的某一张幻灯片。(实现页面灵活跳 转—提高运行效率) (2)外部资源: 【1】其他 PPT文档或其他程序的文档; 【2】网址; 【3】电子邮件地址。(整合多种媒体信息—增强承载 能力)
第5章 超级链接

WEB编程基础
5.3.2书签链接
基本语法:
在同一页面内要使用书签链接的格式: <a href="#书签名称" target="窗口名称">链接标 题</a> 在不同页面之间要使用书签链接的格式(在不同页面中链 接的前提是需要指定好链接的页面地址和链接的书签名 称): <a href="URL地址#书签名称" target="窗口名称 ">链接标题</a> 以上两种书签链接形式,链接到的目标为: <a name="书签名称">链接内容</a>。
WEB编程基础
5.3.4 FTP链接
WEB编程基础
5.3.5下载文件的链接
如果希望制作下载文件的链接,只需在链接地址处输入文
件所在的位置即可。当浏览器用户单击链接后,浏览器会
自动判断文件的类型,以做出不同情况的处理。
基本语法:
<a href="url">链接内容</a>
WEB编程基础
5.3.5下载文件的链接
WEB编程基础
5.2创建超链接
建立超链接的标记是a(anchor,锚),以<a>开始,以 </a>结束,锚可以指向网络上的任何资源:一张HTML 页面,一幅图像,一个声音或视频文件等。 基本语法: <a href="url" title="指向链接显示的文字" target="窗口名称">超链接名称</a>
WEB编程基础
5.5小实例
超级链接

4.3 管理超级链接
5.3.1 5.3.2 5.3.3 5.3.4 5.3.5 自动更新链接 使用站点缓存 批量修改链接 使用站点地图 检查超级链接
4.3.1 自动更新链接
档重新命名或者移动文档时, Dreamweaver MX总是自动对文档中的超级链接进行更新。 Never:从不对站点中的超级链接进行更新。 Prompt:当在本地站点中对文档重新命名或者移动文档时, Dreamweaver MX提示用户是否对文档中的超级链接进行 更新。
4.4 跳转菜单
跳转菜单是利用超级链接实现的一类特殊对象,利用它可以在 不同的页面间进行快速跳转和定位。 跳转菜单的组成部分: 选择提示:例如菜单项的描述或说明。 菜单项列表:用户选择某个菜单项后,该菜单项对应的超级链 接将被打开。 执行按钮:单击执行按钮后执行跳转。
4.5 导航条
E-mail链接是一类特殊的超级链接。单 击这种链接后,系统将调用默认的邮件 客户端程序,允许用户向指定地址发送 电子邮件。
4.2.4 脚本链接
脚本链接:一种特殊类型的链接。通 过单击带有脚本链接的文字或对象, 可以运行相应的JavaScript脚本或函 数,从而实现指定的运算。
4.2.5 空链接
4.1.3 超级链接
超级链接:是从一个网页指向另一个目的端口的链接。 超级链接包括链接的载体和链接的目标地址两个部分。 链接的载体:用来调用其他页面的对象,比如文字和图象。 链接的目标地址:是一个资源的URL地址,可以是一个网页、 一副图象、一个动画或者是FTP、E-mail等其他遵循URL命名 规则的有效URL地址。
4.3.4 使用站点地图
第4章 超级链接

4.3.2 页面之间的锚记链接
4.3锚记链接
(3)再在已输入的路径后面添加“#”号和命名锚 记的名称,如图4.23所示。 (4)保存并浏览该文件,单击其中的链接就能打 开指定的网页,并跳转到指定的位置上。
4.3.2 页面之间的锚记链接
4.3锚记链接
图 4.21 目录文本
图 4.22 “链接”文本框
4.3.1 网页内部锚记链接
4.3锚记链接
(5)创建返回顶部的链接。为了方便浏览,这里可以在网页 顶端添加一个命名锚记,命名为top,如图4.19所示。 (6)然后在网页中每一部分内容的末尾输入文本“返回顶 部”,并在文本上添加返回页面顶端的链接,如图4.20所示。 (7)保存并浏览该网页,单击其中的链接文本“返回顶部”, 就可以返回到页面顶端。
如图4.29所示。
(2)选中绘制完成的多边形热点,如图4.30所示,然后 在“属性”面板上修改热点的各项属性即可。
4.4热点链接
图 4.29 创建多边形的热点
图 4.30 完成的多边形热点
图 4.11 设定 E-mail 链接
4.2.3 添加E-mail链接
4.3锚记链接
如果此时能在该网页创建一个目录,浏览者只需单击目录上的 项目就能跳到网页相应的位置上,如图4.12所示这样就会很方便。 而要实现这样的效果,就需要用到锚记链接。
图 4.12 锚记链接
4.3锚记链接
课堂练习4.3 创建网页内部锚记链接 (1)添加命名锚记。打开素材目录mywebsite\exercise\ links\02.htm文件。将光标放在第1部分的标题文本(即 “一、打开并保存新页”)前,然后在“常用”插入工具栏中 单击“命名锚记”按钮 ,此时将打开“命名锚记”对话框,在 其中输入命名锚记的名称,这里输入open,如图4.13所示。 (2)单击“确定”按钮后,在光标所在的位置上就会出现 一个命名锚记图标,如图4.14所示。
七年级信息技术上册:第12课 第二课时word 超链接的使用课件

5
3
引导学生发现目录中的文字在正文页面中都存在,是否有较为简便的方 法可以通过将正文中的这些文字复制过来,并直接产生链接的效果
大家制作的电子报刊还可以与一些外部文件相链接,如电子邮件, 网页,音乐,视频,动画等等,想想我们做内部链接的时候打开的 创建超链接对话框中除了“本文档中的位置”还有哪些选项
信息技术科学凝聚了人类的智慧 信息技术在社会中具有广泛的用途 信息技术对社会产生了重大影响
第12课第二课时:word 超链接的使用
海城中学 张勇
QQ:411357398 E-MAIL:411357398@
在同学们电脑的的D盘中都有一份名为《数味》的电子报刊,同座 位两个同学相互比较一下你们电脑中这份杂志有没有区别,按住Ctrl 键后用鼠标去发现一下,引入新课──《不得不暂时停止正在阅读的书籍的时候,你会 用什么方法标记你已经读过的部分?我们通常会在刚刚读完的地方 插入一个书签,以便今后通过寻找书签的方法,快速定位我们想要 阅读的部分继续阅读了。同样的,在电子报刊中,我们也可以通过 使用书签的方法来标记各个的页面,然后将它们与目录相链接,以 方便阅读演示书签链接的方法。
第6章超级链接

地址链接
基于书写相对路径,总结如下:
如果要链接到与当前文档处在同一文件夹中的其他 文件,只需输入文件名称即可。 如果要链接到当前文档所在的文件夹的子文件夹中 的文件,只需提供子文件的名称,后跟一斜杠,再 在后面输入该文件名即可。 如果要链接到当前文档所在文件夹的父文件夹中的 文件,需要在文件名前添加“../”,这里的../表示 “在文件夹层次结构中上移一级”在。
先将光标放置在网页中需要插入锚记的位置,单击 工具栏中的 按钮,在弹出的对话框中插入锚记的 名称,设置完毕后单击完成。选中将要建立锚点链 接的内容,在属性检查器的“链接”文本框中输入 锚记名称。 也可以通过拖动“链接”文本框后的 到要链接的 锚点处来链接锚点 。
书签链接和热点链接
热点链接
热点链接就是在图片上定义一定形状的区域, 然后给这些区域加上链接,这些区域被成为热 点。
地址链接
(2)根目录相对地址
如果要创建的是内部链接,用户还可以选择根目录 相对地址,这种地址在动态网页编写时用得比较多, 但如果只是静态的网页,使用文件相对地址还是方 便的多。根目录相对地址的书写形式比较简单,首 先以一个向右的斜杠开头,用它代表根目录。然后 再书写文件夹名,最后书写文件名。
超级链接
超级链接
超级链接分为内部链接与外部链接,它们是相 对站点目录而言的。如果超级链接所链接的站 点目录内的文件,这样的链接就是内部链接; 相反,如果链接的是站点目录之外的文件,这 样的链接就被称为外部链接。
添加链接
添加外部链接
创建外部链接使用绝对路径,链接的载体一般为文 字或图片。 (演示)
添加内部链接
制作热点链接
在展开的“属性“面板上的绘图工具在画面上绘制热区点。 在“属性”面板的左下有3个分别绘制矩形、椭圆形、多 边形热点的工具。选中热点,进行相应设置。(演示)
第五讲 超级链接

(2)在“文档选项”部分,从“移动文件时更新链接”弹出菜单中
选择“总是”或者“提示”。若选择“总是”,则每当移动或重 命名选定文档时,Dreamweaver 将自动更新起至和指向该文档的 所有链接。
小结
本章介绍了超级链接的基本概念,并描述了如何创建各种形式的超级链接。
实验3、制作超级链接热点地图
例如:创建从 contents.html 到其它文件的链接,如下所示:
(1)若要从 contents.html 链接到 hours.html(两个
文件在同一文件夹中),文件名就是相对路径: hours.html。 (2)若要链接到 tips.html(在名为 resources 的子 文件夹中),可使用相对路径resources/tips.html。每 个正斜杠 (/) 表示在文件夹层次结构中下移一级。 (3)若要链接到 index.html(在父文件夹中, contents.html 向上一级),可使用相对路 径 ../index.html。 每个 ../ 表示在文件夹层次结构中上 移一级。
第五讲 超级链接
(super link)
作为网站肯定有很多的页面,如果页面之间彼此是独 立的,那么网页就好比是孤岛,这样的网站是无法运行的。 为了建立起网页之间的联系我们必须使用超级链接。称 “超级链接”,是因为它什么都能链如:网页、下载文件、
网站地址、邮件地址……等等。
5.1超级链接概述
一、链接的基本概念 1、概念:超级链接是指站点内不同网页之间、站点点与Web之间的链接 关系,它可以使站点内的网页成为有机的整体,还能使不同站点之间建 立联系。
2、超级链接的组成:链接载体和链接目标
(1)链接载体:许多网页元素,如:文本、图像、图像热区、动画 等。
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
(2) 若要链接到 book1.htm(在名为 book1 的子文件 夹中),可使用相对路径 book1/book1.htm。每 个正斜杠 (/) 表示在文件夹层次结构中下移一级。
(3) 若 要 链 接 到 index.html ( 在 父 文 件 夹 中 , booklist1.htm 向 上 一 级 ) , 可 使 用 相 对 路 径 ../index.htm。每个 ../ 表示在文件夹层次结构中上移 一级。
方法二:
链接目标文件
将鼠标光标定位于页面中的文字“关于本站”后,选择 主菜单“【插入】→【超级链接】”,弹出“超级链
接”对话框,输入相应内容,如图5-1-6所示。
在“超级链接”对话框中,设置以下选项: ❖ 文本:显示在页面中的文字。 ❖ 链接:所要链接的目标文档。 ❖ 目标:为打开的窗口类型(详见本例最后一段)。 ❖ 标题:为鼠标置于链接文字上方时所出现的提示。 效果如图5-1-7所示。
(4) 若要链接到 picture1.htm(在父文件夹的其它子文 件夹中),可使用相对路径 ../mypictures/picture1.htm。其中 ../ 向上移至父文 件夹; mypictures/ 向下移至 mypictures子文件夹 中。
3、站点根目录相对路径
站点根目录相对路径以一个正斜杠(/)开始,该正斜杠 表 示 站 点 根 文 件 夹 。 例 如 , /mybooks/ booklist1.htm 是文件 (booklist1.htm) 的站点根目录 相对路径,该文件位于站点根文件夹的 mybooks子文 件夹中。
方法三: 打开属性面板,选择“链接(L)”右边的“指向文件” 图标“”,拖动该图标至站点目录下的 “learnlanguage.htm”文件,即可自动生成链接。 如图5-1-8所示。
“指向文件”图标
如果同时打开两个或以上编辑窗口,则只需将“指向 文件”图标直接拖动至目标窗口的任意位置即可自动 生成链接。如图5-1-9所示。
在浏览器中,超链接通常以带下划线的文本以及特定 的颜色区别于网页内的其他内容,当鼠标指向它的时 候,会变成手形,单击即可打开超链接。
有三种类型的链接路径:
1、 绝对地址
绝对路径由http://、等开始的,它不仅提供所链接文 档的完整 URL,而且包括所使用的协议(如对于 Web 服务为http://,FTP服务为)。
第5章 超级链接的使用
本章学习目标
❖ 掌握超级链接的作用及类型 ❖ 掌握文本和图片链接的创建方法 ❖ 掌握Email、锚点链接的创建方法 ❖ 掌握热区链接的创建方法 ❖ 掌握链接效果的编辑方法
5.1 创建超级链接
5.1.1 超级链接的作用及类型
超链接是文档与文档之间的链接,当单击它时, 超链接可指向另外一个页面或文件。链接目标通常是 另外一个网页,但也可以是一幅图片、一个电子邮件 地址或其他文档。
例如,假设一个站点的结构如图5-1-1所示:
创建从boLeabharlann klist1.htm到其它文件的链接,如下所示
(1) 要从 booklist1.htm 链接到booklist2.htm (两个文 件在同一文件夹中),文件名就是相对路径: booklist2.htm或 ./booklist2.htm。其中./ 表示在 同一文件夹中。
方法一: 选择页面上方文字“语言学习”,然后单击属性面板 上“链接”文本框右侧的文件夹图标,弹出“选择文 件”对话框,选择“learnlanguage.htm”文件,在 对话框“相对于”中选择“文档”,单击“确定”按 钮关闭对话框,如图5-1-4所示。
默认为“文挡 ”
完成上述步骤,属性面板相应各项设置如图5-1-5所示。
注意:
尽管对本地链接(即到同一站点内文档的链接)也可使 用绝对路径链接,但不建议采用这种方式,因为一旦 将此站点移动到其它服务器,则所有本地绝对路径链 接都将断开。对本地链接使用相对路径还能在需要在 站点内移动文件时,提供更大的灵活性。
2、相对地址
相对地址是由文件名及其扩展名组成的,并且假设 URL指向位于同一台WEB服务器上的文件。
“指向文件”图标指向 目标窗口任意位置
方法四:
打开属性面板,在“链接(L)” 直接输入链接地址, 如要链接到站点内的其他文档,输入目标文件的具体 路径与文件名;要链接到站点以外的文档,则输入完 整 URL,而且包括所使用的协议。
例如,选中“index.htm”文档中的“logo.gif”图 片,打开属性面板,在“链接(L)”直接输入,即可自 动生成目标指向网站下的index.asp文档的链接。如图 5-1-10所示。
好的空白电子邮件。 ❖ 空链接和脚本链接,此类链接使您能够在对象上附加
行为,或者创建执行 JavaScript 代码的链接。
注意:创建链接之前,一定要清楚文档相对路径、站点根 目录相对路径以及绝对路径的工作方式。
5.1.2 实例:创建超级链接
1、实例创意 下面以实例制作一个简单网页,实例中只用到简单的几 个页面元素,主要有表格、文本和图片。各个文件的 文件名及位置如图5-1-2如示。
2.制作步骤
(1)定义本书素材source目录下的文件夹5-1-2为本地 站点目录。
(2)创建链接
创建超级链接有多种方法,本节将分别介绍几种不同 方式来完成超级链接的创建。
多数情况下,创建链接在【属性】面板中完成,也可以 通过主菜单“【插入】→【超级链接】”来完成。
打开根目录下的index.htm文件并选择“【窗口】→【 属性】”菜单命令,打开【属性】面板,如图5-1-3所 示。
在某些 Web 站点中,需要经常在不同文件夹之间移动 HTML 文件,在这种情况下,站点根目录相对路径通 常是指定链接的最佳方法。移动含有根目录相对链接 的文档时,不需要更改这些链接 。
在一个文档中可以创建几种类型的链接: ❖ 链接到其它文档或文件(如图形、影片、PDF 或声音
文件)的链接。 ❖ 命名锚记链接,此类链接跳转至文档内的特定位置。 ❖ 电子邮件链接,此类链接新建一个收件人地址已经填
直接输入
在默认情况下,被链接的文件在当前窗口或框架内打 开。要使被链接的文档显示在其他窗口或新的窗口或 框架内,则需设置属性面板中的“目标(R)”选项,如 图5-1-11所示。
(3) 若 要 链 接 到 index.html ( 在 父 文 件 夹 中 , booklist1.htm 向 上 一 级 ) , 可 使 用 相 对 路 径 ../index.htm。每个 ../ 表示在文件夹层次结构中上移 一级。
方法二:
链接目标文件
将鼠标光标定位于页面中的文字“关于本站”后,选择 主菜单“【插入】→【超级链接】”,弹出“超级链
接”对话框,输入相应内容,如图5-1-6所示。
在“超级链接”对话框中,设置以下选项: ❖ 文本:显示在页面中的文字。 ❖ 链接:所要链接的目标文档。 ❖ 目标:为打开的窗口类型(详见本例最后一段)。 ❖ 标题:为鼠标置于链接文字上方时所出现的提示。 效果如图5-1-7所示。
(4) 若要链接到 picture1.htm(在父文件夹的其它子文 件夹中),可使用相对路径 ../mypictures/picture1.htm。其中 ../ 向上移至父文 件夹; mypictures/ 向下移至 mypictures子文件夹 中。
3、站点根目录相对路径
站点根目录相对路径以一个正斜杠(/)开始,该正斜杠 表 示 站 点 根 文 件 夹 。 例 如 , /mybooks/ booklist1.htm 是文件 (booklist1.htm) 的站点根目录 相对路径,该文件位于站点根文件夹的 mybooks子文 件夹中。
方法三: 打开属性面板,选择“链接(L)”右边的“指向文件” 图标“”,拖动该图标至站点目录下的 “learnlanguage.htm”文件,即可自动生成链接。 如图5-1-8所示。
“指向文件”图标
如果同时打开两个或以上编辑窗口,则只需将“指向 文件”图标直接拖动至目标窗口的任意位置即可自动 生成链接。如图5-1-9所示。
在浏览器中,超链接通常以带下划线的文本以及特定 的颜色区别于网页内的其他内容,当鼠标指向它的时 候,会变成手形,单击即可打开超链接。
有三种类型的链接路径:
1、 绝对地址
绝对路径由http://、等开始的,它不仅提供所链接文 档的完整 URL,而且包括所使用的协议(如对于 Web 服务为http://,FTP服务为)。
第5章 超级链接的使用
本章学习目标
❖ 掌握超级链接的作用及类型 ❖ 掌握文本和图片链接的创建方法 ❖ 掌握Email、锚点链接的创建方法 ❖ 掌握热区链接的创建方法 ❖ 掌握链接效果的编辑方法
5.1 创建超级链接
5.1.1 超级链接的作用及类型
超链接是文档与文档之间的链接,当单击它时, 超链接可指向另外一个页面或文件。链接目标通常是 另外一个网页,但也可以是一幅图片、一个电子邮件 地址或其他文档。
例如,假设一个站点的结构如图5-1-1所示:
创建从boLeabharlann klist1.htm到其它文件的链接,如下所示
(1) 要从 booklist1.htm 链接到booklist2.htm (两个文 件在同一文件夹中),文件名就是相对路径: booklist2.htm或 ./booklist2.htm。其中./ 表示在 同一文件夹中。
方法一: 选择页面上方文字“语言学习”,然后单击属性面板 上“链接”文本框右侧的文件夹图标,弹出“选择文 件”对话框,选择“learnlanguage.htm”文件,在 对话框“相对于”中选择“文档”,单击“确定”按 钮关闭对话框,如图5-1-4所示。
默认为“文挡 ”
完成上述步骤,属性面板相应各项设置如图5-1-5所示。
注意:
尽管对本地链接(即到同一站点内文档的链接)也可使 用绝对路径链接,但不建议采用这种方式,因为一旦 将此站点移动到其它服务器,则所有本地绝对路径链 接都将断开。对本地链接使用相对路径还能在需要在 站点内移动文件时,提供更大的灵活性。
2、相对地址
相对地址是由文件名及其扩展名组成的,并且假设 URL指向位于同一台WEB服务器上的文件。
“指向文件”图标指向 目标窗口任意位置
方法四:
打开属性面板,在“链接(L)” 直接输入链接地址, 如要链接到站点内的其他文档,输入目标文件的具体 路径与文件名;要链接到站点以外的文档,则输入完 整 URL,而且包括所使用的协议。
例如,选中“index.htm”文档中的“logo.gif”图 片,打开属性面板,在“链接(L)”直接输入,即可自 动生成目标指向网站下的index.asp文档的链接。如图 5-1-10所示。
好的空白电子邮件。 ❖ 空链接和脚本链接,此类链接使您能够在对象上附加
行为,或者创建执行 JavaScript 代码的链接。
注意:创建链接之前,一定要清楚文档相对路径、站点根 目录相对路径以及绝对路径的工作方式。
5.1.2 实例:创建超级链接
1、实例创意 下面以实例制作一个简单网页,实例中只用到简单的几 个页面元素,主要有表格、文本和图片。各个文件的 文件名及位置如图5-1-2如示。
2.制作步骤
(1)定义本书素材source目录下的文件夹5-1-2为本地 站点目录。
(2)创建链接
创建超级链接有多种方法,本节将分别介绍几种不同 方式来完成超级链接的创建。
多数情况下,创建链接在【属性】面板中完成,也可以 通过主菜单“【插入】→【超级链接】”来完成。
打开根目录下的index.htm文件并选择“【窗口】→【 属性】”菜单命令,打开【属性】面板,如图5-1-3所 示。
在某些 Web 站点中,需要经常在不同文件夹之间移动 HTML 文件,在这种情况下,站点根目录相对路径通 常是指定链接的最佳方法。移动含有根目录相对链接 的文档时,不需要更改这些链接 。
在一个文档中可以创建几种类型的链接: ❖ 链接到其它文档或文件(如图形、影片、PDF 或声音
文件)的链接。 ❖ 命名锚记链接,此类链接跳转至文档内的特定位置。 ❖ 电子邮件链接,此类链接新建一个收件人地址已经填
直接输入
在默认情况下,被链接的文件在当前窗口或框架内打 开。要使被链接的文档显示在其他窗口或新的窗口或 框架内,则需设置属性面板中的“目标(R)”选项,如 图5-1-11所示。