高中信息技术第7章在网页中使用超链接课件粤教版.ppt
《高中信息技术第7章在网页中使用超链接课件粤教版.ppt》由会员分享,可在线阅读,更多相关《高中信息技术第7章在网页中使用超链接课件粤教版.ppt(18页珍藏版)》请在淘文阁 - 分享文档赚钱的网站上搜索。
1、 通过本章学习,应该掌握以下内容:通过本章学习,应该掌握以下内容:1.认识超链接认识超链接 2.利利用用Dreamweaver创创建建各各种种超超连连接接的的方方法法 3.利利用用Dreamweaver编编辑辑各各种种超超连连接接的的方方法法 4.利利用用HTML和和FrontPage创创建建、编编辑辑超超链链接的方法网页制作的基本步骤接的方法网页制作的基本步骤第第7章章 在网页中使用超链接在网页中使用超链接 7.1 利用利用Dreamweaver 4.0处理超链接处理超链接 7.1.1 创建文字超链接创建文字超链接 1超链接简介超链接简介 超超链链接接是是WWWWWW技技术术的的核核心心,是
2、是网网页页中中最最重重要要、最最根根本本的的元元素素之之一一。超超链链接接能能够够使使多多个个孤孤立立的的网网页页之之间间产产生生一一定定的的相相互互联联系系,从从而而使使单单独的网页形成一个有机的整体。独的网页形成一个有机的整体。(1)什么是超链接)什么是超链接 所所谓谓的的超超链链接接是是指指从从一一个个网网页页指指向向一一个个目目标标的的连连接接关关系系,这这个个目目标标可可以以是是另另一一个个网网页页,也也可可以以是是相相同同网网页页上上的的不不同同位位置置,还还可可以以是是一一个个图图片片、一一个个电电子子邮邮件件地地址址、一一个个文文件件,甚甚至至是是一一个个应应用用程程序序。而而
3、在在一一个个网网页页中中用用来来超超链链接接的的对对象象,可可以以是是一一段段文文本本或或者者是是一一个个图图片片。当当浏浏览览者者单单击击已已经经链链接接的的文文字字或或图图片片后后,链链接接目目标标将将显显示示在在浏浏览器上,并且根据目标的类型来打开或运行。览器上,并且根据目标的类型来打开或运行。按按照照链链接接路路径径的的不不同同,网网页页中中超超链链接接一一般般分分为为以以下下3种种类类型型:内部链接、锚点链接和外部链接。内部链接、锚点链接和外部链接。如如果果按按照照使使用用对对象象的的不不同同,网网页页中中的的链链接接又又可可以以分分为为:文文本本超超链链接接、图图像像超超链链接接、
4、E-mail链链接接、锚锚点点链链接接、多多媒媒体体文文件件链链接接、空空链链接等。接等。(2)合理安排超链接)合理安排超链接 合理安排超链接在网页的制作中是非常重要的。采用什么结合理安排超链接在网页的制作中是非常重要的。采用什么结构的链接会直接影响到网页的布局。构的链接会直接影响到网页的布局。在这里给大家一些设计链接的建议。在这里给大家一些设计链接的建议。1。避避免免孤孤立立文文件件的的存存在在:应应该该避避免免存存在在孤孤立立的的文文件件,这这样样能能使将来在修改和维护链接时有清晰的思路。使将来在修改和维护链接时有清晰的思路。2。在在网网页页中中避避免免使使用用过过多多的的超超级级链链接接
5、:在在一一个个网网页页中中设设置置过过多多超超链链接接会会导导致致网网页页的的观观赏赏性性不不强强,文文件件过过大大。如如果果避避免免不不了了过过多多的的超超链链接接,可可以以尝尝试试使使用用下下拉拉列列表表框框、动动态态链链接接等等一一些些链链接接方方式。式。3。网网页页中中的的超超链链接接不不要要超超过过4层层:链链接接层层数数过过多多容容易易让让人人产产生生厌厌烦烦的的感感觉觉,在在力力求求做做到到结结构构化化的的同同时时,应应注注意意链链接接避避免免超超过过4层。层。4。页页面面较较长长时时可可以以使使用用书书签签:在在页页面面较较长长时时,可可以以定定义义一一个个书签,这样能让浏览者
6、方便地找到想要的信息。书签,这样能让浏览者方便地找到想要的信息。5。设设置置主主页页或或上上一一层层的的链链接接:有有些些浏浏览览者者可可能能不不是是从从网网站站的的主主页页进进入入网网站站的的,设设置置主主页页或或上上一一层层的的链链接接,会会让让浏浏览览者者更更加加方方便地浏览全部网页。便地浏览全部网页。2建立文本超链接建立文本超链接 在创建超链接之前,首先了解网站中在创建超链接之前,首先了解网站中3种类型的文档路径:绝种类型的文档路径:绝对路径、和根目录相对路径以及和文档相对路径。对路径、和根目录相对路径以及和文档相对路径。绝绝对对路路径径:是是包包含含服服务务器器协协议议(对对于于网网
7、页页来来说说通通常常是是http:/或或ftp:/)的的完完全全路路径径,绝绝对对路路径径包包含含的的是是精精确确地地址址而而不不用用考考虑虑源源文文件件的的位位置置。但但是是如如果果目目标标文文件件被被移移动动,则则链链接接无无效效。创创建建外外部部超超链链接时必须使用绝对路径。接时必须使用绝对路径。和和根根目目录录相相对对的的路路径径:是是从从当当前前站站点点的的根根目目录录开开始始的的路路径径。站站点点上上所所有有可可公公开开的的文文件件都都存存放放在在站站点点的的根根目目录录下下。和和根根目目录录相相对对的的路径使用斜杠以告诉服务器从根目录开始。路径使用斜杠以告诉服务器从根目录开始。和
8、文档相对的路径:是指和当前文档所在的文件夹相对的路和文档相对的路径:是指和当前文档所在的文件夹相对的路径。这种路径通常是最简单的路径,可以用来链接和当前文档处于径。这种路径通常是最简单的路径,可以用来链接和当前文档处于同一文件夹下的文档。同一文件夹下的文档。(1)创建文本超链接)创建文本超链接 在网页上选择需要添加超链接的文本,此时属性面板成为文本在网页上选择需要添加超链接的文本,此时属性面板成为文本属性面板;属性面板;在在属属性性面面板板上上指指定定文文字字的的链链接接目目标标。可可按按以以下下4种种方方法法指指定定文文字的超链接:字的超链接:单击单击“Link”文本框右侧的文件夹按钮,在弹
9、出的文本框右侧的文件夹按钮,在弹出的“选择文件选择文件”对话框中选择链接的目标文件。对话框中选择链接的目标文件。在文本框中直接输入目标的绝对路径。在文本框中直接输入目标的绝对路径。利用属性面板上的利用属性面板上的“Point to File(指向文件)(指向文件)”按钮,为文字按钮,为文字加入超链接。但必须要建立本地站点,且本地站点上还要有文件存加入超链接。但必须要建立本地站点,且本地站点上还要有文件存在,才能使用此方法。在,才能使用此方法。选择选择“Modify”|“Make Link”命令,也可打开命令,也可打开“选择文件选择文件”对对话框。话框。确定完链接目标之后,在确定完链接目标之后,
10、在“Link”文本框中出现文字的链文本框中出现文字的链接目标。在接目标。在“Target”下拉列表框中选择目标文件打开的方式下拉列表框中选择目标文件打开的方式 Target表示所链接的目标文件在浏览器中打开的方式,在其下表示所链接的目标文件在浏览器中打开的方式,在其下拉列表框中一共有拉列表框中一共有4个选项:个选项:blank:将目标文件载入到新的未命名浏览器窗口中。:将目标文件载入到新的未命名浏览器窗口中。parent:将目标文件载入到父框架集或包含该链接的框架窗口中。:将目标文件载入到父框架集或包含该链接的框架窗口中。self:将目标文件载入与该链接相同的框架或窗口中。:将目标文件载入与该
11、链接相同的框架或窗口中。top:将目标文件载入到整个浏览器窗口并删除所有框架。:将目标文件载入到整个浏览器窗口并删除所有框架。_parent、_self、_top只有在使用框架页面时才有效。只有在使用框架页面时才有效。设置结束后,在网页中被选择的文字颜色变为蓝色,且在文字设置结束后,在网页中被选择的文字颜色变为蓝色,且在文字底部出现一条下划线,即文字的超链接设置完成。底部出现一条下划线,即文字的超链接设置完成。(2)编辑文本超链接)编辑文本超链接设置文本链接的状态设置文本链接的状态 一个未被访问过的链接与一个被激活的链接在形式上肯定会一个未被访问过的链接与一个被激活的链接在形式上肯定会有所区别
12、,链接被访问过了也会发生变化,提示用户这是一个已经有所区别,链接被访问过了也会发生变化,提示用户这是一个已经点击过的链接,所有这些都是链接的状态。通过设置不同的文本颜点击过的链接,所有这些都是链接的状态。通过设置不同的文本颜色可以使各个状态区别开来。色可以使各个状态区别开来。设置不同的文本颜色的具体步骤如下:设置不同的文本颜色的具体步骤如下:打开包含文本链接的文档打开包含文本链接的文档“园丁乐园园丁乐园”,选择主菜单中的,选择主菜单中的“Modify(修改)(修改)”|“Page Properties(页面属性)(页面属性)”命令,打命令,打开开“Page Properties(页面属性)(页
13、面属性)”对话框;对话框;单单击击“Links(链链接接)”项项右右边边的的图图标标,打打开开调调色色板板,选选取取一一种种颜颜色;色;同同样样为为“Visited Links(访访问问过过的的链链接接)”、“Active(活活动动链链接)接)”项设置不同的颜色;项设置不同的颜色;单击单击“Ok”按钮,完成设置。按钮,完成设置。设置完成之后,按下设置完成之后,按下“F12”键,预览网页,链接的三种状态键,预览网页,链接的三种状态通过不同的颜色区别开来。通过不同的颜色区别开来。删除文本超链接删除文本超链接 在在Dreamweaver 4.0中要删除一个文本超链接很容易,先用中要删除一个文本超链接
14、很容易,先用鼠标选定文本对象,将光标定位于属性面板的鼠标选定文本对象,将光标定位于属性面板的“Link”文本框中,文本框中,用用“BackSpace”键或键或“Delete”键,将其显示的超链接对象文件键,将其显示的超链接对象文件名删除,再回车,或选择名删除,再回车,或选择“Modify”|“Remove Link”命令,都可命令,都可以删除超链接而保留原文本对象。以删除超链接而保留原文本对象。7.1.2 创建图片超链接创建图片超链接1创建图片超链接创建图片超链接 创建图片超链接的步骤如下:创建图片超链接的步骤如下:(1)选中所需建立超链接的图片,此时属性面板为图片的属)选中所需建立超链接的图
15、片,此时属性面板为图片的属性面板。性面板。(2)在在图图片片属属性性面面板板中中,为为图图片片添添加加文文档档相相对对路路径径的的链链接接。具具体方法可参考为文本添加超链接的操作;体方法可参考为文本添加超链接的操作;(3)按)按“F12”预览网页。预览网页。图像连接不像文本链接那样,会发生许多提示,图像本身不图像连接不像文本链接那样,会发生许多提示,图像本身不会发生改变,只是在预览网页时,当鼠标指针经过带链接的图像会发生改变,只是在预览网页时,当鼠标指针经过带链接的图像时,指针的形状变为时,指针的形状变为“手手”的形状。点击图像就会打开所链接的的形状。点击图像就会打开所链接的文档。文档。7.1
16、.3 创建锚点超链接创建锚点超链接 在在一一些些内内容容很很多多的的网网页页中中,设设计计者者常常常常在在该该网网页页的的开开始始部部分分以以网网页页内内容容的的小小标标题题作作为为超超链链接接。当当浏浏览览者者单单击击网网页页开开始始部部分分的的小小标标题题时时,网网页页将将跳跳到到内内容容中中的的对对应应小小标标题题上上,免免去去浏浏览览者者翻翻阅阅网网页页寻寻找找信信息息的的麻麻烦烦。其其实实,这这是是在在网网页页中中的的小小标标题题添添加加了了锚锚点点,再再通通过过对对锚点的链接来实现的。锚点的链接来实现的。锚点,也称为书签,用来标记文档中的特定位置,使用其可锚点,也称为书签,用来标记
17、文档中的特定位置,使用其可以跳转到当前文档或其他文档中的标记位置。在网页中加入锚点包以跳转到当前文档或其他文档中的标记位置。在网页中加入锚点包括两方面的工作,一是在网页中创建锚点,另一个是为锚点建立链括两方面的工作,一是在网页中创建锚点,另一个是为锚点建立链接。接。1创建锚点创建锚点 创建锚点的步骤如下:创建锚点的步骤如下:(1)将将光光标标移移到到需需要要加加入入锚锚点点的的地地方方,一一般般是是将将光光标标放放置置在在一一行行或或是一段文字的开头部分;是一段文字的开头部分;(2)单单击击对对象象面面板板“Invisibles”类类上上的的“插插入入锚锚点点”按按钮钮,将将弹弹出出“Inse
18、rt Named Anchor(插入命名锚点)(插入命名锚点)”对话框;对话框;(3)在对话框的)在对话框的“Anchor Name”文本框输入锚点的名称;文本框输入锚点的名称;(4)单击)单击“OK”按钮。按钮。执行完上述操作之后,则在光标处出现一个代表锚点的图标。执行完上述操作之后,则在光标处出现一个代表锚点的图标。在命名锚点时,必须遵循以下规定:在命名锚点时,必须遵循以下规定:只只能能使使用用字字母母和和数数字字,锚锚点点命命名名不不支支持持中中文文。虽虽然然在在插插入入锚锚点点对对话话框框中中能能输输入入中中文文,但但在在属属性性面面板板上上显显示示的的则则是是一一堆堆乱乱码码,且且在
19、在为锚点添加链接的时候,也无法工作。为锚点添加链接的时候,也无法工作。锚锚点点名名称称的的第第1个个字字符符最最好好是是英英文文字字母母,一一般般不不要要以以数数字字做做为为锚锚点点名称的开头。名称的开头。锚点名称区别英文字母的大小写。锚点名称区别英文字母的大小写。锚点名称间不能含有空格,也不能含有特殊字符。锚点名称间不能含有空格,也不能含有特殊字符。2链接锚点链接锚点 创创建建锚锚点点后后,还还必必须须链链接接锚锚点点。选选择择想想要要链链接接到到锚锚点点的的文文字字或或图片,然后按如下方法中的任意一种进行操作。图片,然后按如下方法中的任意一种进行操作。在属性面板上的在属性面板上的“Link
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 高中 信息技术 网页 使用 超链接 课件 粤教版
限制150内