网页设计与制作第5章-创建超级链接课件_第1页
网页设计与制作第5章-创建超级链接课件_第2页
网页设计与制作第5章-创建超级链接课件_第3页
网页设计与制作第5章-创建超级链接课件_第4页
网页设计与制作第5章-创建超级链接课件_第5页
已阅读5页,还剩65页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

网页设计与制作第5章-创建超级链接课件1

超级链接是网站中使用比较频繁的HTML元素,因为网站的各种页面都是由超级链接串接而成,超级链接完成了页面之间的跳转。本章将介绍超级链接的基本知识以及创建超级链接的基本方法。第5章创建超级链接超级链接是网站中使用比较频繁的HTML元素,因为网站2学习目标了解超级链接的概念和分类。掌握设置文本和图像超级链接的方法。掌握设置锚记和脚本超级链接的方法。掌握测试和更新超级链接的方法。学习目标了解超级链接的概念和分类。35.1认识超级链接5.1.1超级链接的概念5.1.2链接路径的类型5.1.3超级链接的分类5.1认识超级链接5.1.1超级链接的概念45.1.1超级链接的概念超级链接习惯简称为超链接,是指从一个网页指向一个目标的连接关系,这个目标对象可以是另一个网页,也可以是一个图像、一个电子邮件地址、一个文件(如Word、Excel、Rar、Zip文件等),甚至是一个应用程序,还可以是相同网页上的不同位置。而在一个网页上用作超级链接的载体对象,可以是一段文本或者是一幅图像,甚至可以是一幅图像的某一部分。当浏览者在浏览器中单击已经设置链接的文本或图像后,链接目标将显示在浏览器窗口中,并且根据目标的类型来打开或运行。超级链接在本质上属于一个网页的一部分,它是一种允许用户同其他网页或站点之间进行交互的元素。各个网页链接在一起后,才能真正构成一个网站。5.1.1超级链接的概念超级链接习惯简称为超链接,是指从55.1.1超级链接的概念在因特网中,每个网页都有惟一的地址,通常称为URL(UniformResourceLocator,统一资源定位符)。URL的书写格式通常为“协议://主机名/路径/文件名”,例如,“/bbs/index.htm”便是网站论坛的URL,而“”省略了路径和文件名,但服务器会将首页文件回传给浏览器。由此可以看出,URL主要用来指明通信协议和地址,以便取得网络上的各种服务,它包括以下几个组成部分。• 通信协议:包括HTTP、FTP、Telnet和Mailto等几种形式。• 主机名:指服务器在网络中的IP地址或域名,在因特网中使用的多是域名。• 路径和文件名:主机名与路径及文件名之间以“/”分隔。5.1.1超级链接的概念在因特网中,每个网页都有惟一的地65.1.2 链接路径的类型绝对路径提供所链接文档的完整的URL,没能任何省略部分,其中包括所使用的通信协议,例如,“/support/dreamweaver/contents.html”。对于图像文件,完整的URL可能会类似于“/support/dreamweaver/images/01.jpg”。在一个站点链接其他站点上的文档时,通常使用绝对路径。文档相对路径是指省略当前文档和所链接的文档都相同的绝对路径部分,而只提供不同的路径部分,例如,“dreamweaver/contents.html”。对于大多数站点的本地链接来说,文档相对路径通常是最合适的路径。站点根目录相对路径描述从站点的根文件夹到文档的路径,站点根目录相对路径以“/”开始,“/”表示站点根文件夹,例如,“/support/dreamweaver/contents.html”。在处理使用多个服务器的大型站点或者在使用承载多个站点的服务器时,可能需要使用这种路径。如果需要经常在站点的不同文件夹之间移动HTML文件,那么使用站点根目录相对路径通常也是最佳的方法。5.1.2 链接路径的类型绝对路径提供所链接文档的完整的U75.1.3 超级链接的分类按照不同的标准,超级链接可以有不同的分类。根据链接载体对象的不同,超级链接通常可分为以下两种。• 文本超级链接:以文本作为超级链接载体。• 图像超级链接:以图像作为超级链接形体。根据链接路径类型的不同,超级链接通常可分为以下两种。• 内部超级链接:链接目标位于同一站点内的超级链接形式。• 外部超级链接:链接目标位于站点外的超级链接形式。外部超级链接可以实现网站之间的跳转,从而将浏览范围扩大到整个网络。5.1.3 超级链接的分类按照不同的标准,超级链接可以有不85.1.3 超级链接的分类根据链接目标对象的不同,超级链接可分为以下几种类型。• 网页超级链接:链接到HTML、ASP、PHP等网页文档的链接,这是网站最常见的超链接形式。• 下载超级链接:链接到图像、影片、音频、Word文档、Excel文档、PowerPoint文档、PDF文档等资源文件或RAR、ZIP等压缩文件的链接。• 电子邮件超级链接:链接到电子邮件的超链接形式,将会启动邮件客户端程序,可以写邮件并发送到链接的邮箱中。• 空链接:链接目标形式上为“#”,主要用于在对象上附加行为等。• 脚本链接:链接目标为一段JavaScript脚本代码,用于执行某项操作。• 锚记超级链接:链接目标为网页文档中的某一位置,这一位置可以位于当前网页或其他网页中,这个网页可以位于当前站点内,也可以位于其他站点内。5.1.3 超级链接的分类根据链接目标对象的不同,超级链接95.2文本超级链接

5.2.1教学案例━━1932年我国首次参加奥运会5.2.2文本超级链接5.2.3下载超级链接和空链接5.2.4电子邮件超级链接5.2.5本超级链接的状态5.2.6设置默认的链接相对路径5.2文本超级链接5.2.1教学案例━━1932年我国105.2.1教学案例━━1932年我国首次参加奥运会将素材文档复制到站点文件夹下,然后根据要求设置超级链接,在浏览器中的显示效果如图5-1所示。(1) 设置网页中文本“奥运会首位中国运动员刘长春”的链接目标文件为“liuchangchun.htm”,打开目标窗口的方式为在新窗口中打开,标题文本为“刘长春”。(2) 设置网页中文本“奥运会首位中国运动员刘长春纪念雕塑”的链接目标文件为“diaosu.htm”,打开目标窗口的方式为在新窗口中打开,标题文本为“刘长春纪念雕塑”。(3) 设置文本“百度”的链接地址为“”,打开目标窗口的方式为在新窗口中打开,标题文本为“到百度检索”。(4) 设置文本“下载图像压缩包”的链接目标文件为“images/images.rar”,标题文本为“下载图像”。(5) 设置文本“反馈给我们”的链接目标为电子邮件地址“us@163.com”,标题文本为“反馈意见或建议”。(6) 设置链接颜色和已访问链接颜色均为“#0CF”,变换图像链接颜色为“#F00”,且仅在变换图像时显示下划线。5.2.1教学案例━━1932年我国首次参加奥运会将素材文115.2.1教学案例━━1932年我国首次参加奥运会5.2.1教学案例━━1932年我国首次参加奥运会125.2.2 文本超级链接一、通过【属性(HTML)】面板创建超级链接。5.2.2 文本超级链接一、通过【属性(HTML)】面板创135.2.2 文本超级链接二、通过【超级链接】对话框创建超级链接。5.2.2 文本超级链接二、通过【超级链接】对话框创建超级145.2.3 下载超级链接和空链接在实际应用中,链接目标也可以是其他类型的文件。如果要在网站中提供资料下载,就需要为文件提供下载超级链接。下载超级链接并不是一种特殊的链接,只是下载超级链接所指向的文件是特殊的,如压缩文件、Word文档或PDF文档等。空链接是一个未指派目标的链接。空链接用于向页面上的对象或文本附加行为。例如,可向空链接附加一个行为,以便在鼠标光标滑过该链接时会交换图像或显示绝对定位的元素(AP元素)。设置空链接的方法很简单,选中文本等链接载体后,在【属性(HTML)】面板的【链接】文本框中输入“#”即可5.2.3 下载超级链接和空链接在实际应用中,链接目标也可15

创建电子邮件超级链接的方法是:选择菜单命令【插入】/【电子邮件链接】,或在【插入】面板【常用】类别中单击【电子邮件链接】按钮,打开【电子邮件链接】对话框进行参数设置。如果要修改电子邮件链接的E-mail,可以通过【属性(HTML)】面板进行设置。通过【属性(HTML)】面板也可以看出,“mailto:”、“@”和“.”这3个元素在电子邮件链接中是必不可少的。为了更快捷地创建电子邮件超级链接,可以先选中需要添加链接的载体,然后在【属性(HTML)】面板的【链接】文本框中直接输入电子邮件地址,并在其前面加一个前缀“mailto:”,最后按Enter键确认即可。5.2.4 电子邮件超级链接创建电子邮件超级链接的方法是:选择菜单命令【插入】/【电子16

通过【页面属性】对话框的【链接(CSS)】分类,可以设置文本超级链接的状态,包括字体、大小、颜色及下划线等。5.2.5 文本超级链接的状态通过【页面属性】对话框的【链接(CSS)】分类,可以设置文17如果要使用站点根目录相对路径创建超级链接,必须首先在DreamweaverCS6中定义一个本地文件夹,作为Web服务器上文档根目录的等效目录,DreamweaverCS6使用该文件夹确定文件的站点根目录相对路径。同时,在【管理站点】对话框中双击打开要设置的站点,展开【高级设置】选项,然后在【本地信息】类别的【链接相对于】选项中选择【站点根目录】单选按钮。5.2.6设置默认的链接相对路径如果要使用站点根目录相对路径创建超级链接,必须首先在Dre185.3图像超级链接5.3.1教学案例━━衰败的城市5.3.2图像超级链接

5.3.3图像热点超级链接

5.3.4鼠标经过图像

5.3图像超级链接5.3.1教学案例━━衰败的城市195.3.1教学案例━━衰败的城市将素材文档复制到站点文件夹下,然后根据要求设置超级链接,在浏览器中的显示效果如图5-24所示。(1) 给图像“01.jpg”添加超级链接,目标文件为“city01.htm”,打开目标窗口的方式为在新窗口中打开,替换文本为“衰败的城市情景1”。(2) 给图像“02.jpg”添加超级链接,目标文件为“city02.htm”,打开目标窗口的方式为在新窗口中打开,替换文本为“衰败的城市情景2”。(3) 给图像“03.jpg”添加超级链接,目标文件为“city03.htm”,打开目标窗口的方式为在新窗口中打开,替换文本为“衰败的城市情景3”。(4) 在图像“baidu.jpg”上创建3个圆形热点超级链接,分别指向文件“/”、“/”、“/”,打开目标窗口的方式均为在新窗口中打开,替换文本分别为“hao123”、“网站导航”、“百度口碑”。(5) 插入鼠标经过图像对象,原始图像为“images/xin01.jpg”,鼠标经过图像为“images/xin02.jpg”,替换文本为“请给我写信”,前往的URL为“mailto:us@163.com”。5.3.1教学案例━━衰败的城市将素材文档复制到站点文件205.3.1教学案例━━衰败的城市5.3.1教学案例━━衰败的城市215.3.2 图像超级链接用图像作为链接载体,这就是通常意义上的图像超级链接。最简单的设置方法仍然是通过【属性】面板来进行。5.3.2 图像超级链接用图像作为链接载体,这就是通常意义225.3.3 图像热点超级链接创建图像热点超级链接的方法是:首先选中图像,然后在【属性】面板中单击热点工具按钮,并将鼠标光标移到图像上,绘制一个区域,并在【属性】面板中设置链接地址、目标窗口和替换文本。5.3.3 图像热点超级链接创建图像热点超级链接的方法是:235.3.4 鼠标经过图像创建鼠标经过图像的方法是,选择菜单命令【插入】/【图像对象】/【鼠标经过图像】,或在【插入】面板的【常用】类别的图像按钮组中单击【鼠标经过图像】按钮,打开【插入鼠标经过图像】对话框,在其中进行参数设置即可。5.3.4 鼠标经过图像创建鼠标经过图像的方法是,选择菜单245.4 锚记和脚本超级链接5.4.1教学案例━━百年前的美丽风景5.4.2创建锚记超级链接5.4.3设置脚本超级链接5.4 锚记和脚本超级链接5.4.1教学案例━━百年前255.4.1教学案例━━百年前的美丽风景将素材文档复制到站点文件夹下,然后根据要求设置锚记超级链接和脚本超级链接,在浏览器中的显示效果如图5-40所示。(1) 在正文中每幅图像上面的说明文本后面依次添加命名锚记“a”、“b”、“c”、“d”、“e”、“f”、“g”。(2) 给“导航:”后面的每个小标题依次添加锚记超级链接,分别链接到正文中相对应命名锚记处。(3) 给文本“打印本页”添加打印功能的脚本链接。(4) 给文本“关闭窗口”添加关闭浏览器窗口功能的脚本链接。5.4.1教学案例━━百年前的美丽风景将素材文档复制到站265.4.1教学案例━━百年前的美丽风景5.4.1教学案例━━百年前的美丽风景275.4.2 创建锚记超级链接创建锚记超级链接,通常需要两个步骤:首先需要命名锚记,即在文档中设置标记,这些标记通常放在文档的特定主题处或顶部,然后在【属性(HTML)】面板中设置指向这些锚记的超级链接。• 创建命名锚记• 创建锚记超级链接5.4.2 创建锚记超级链接创建锚记超级链接,通常需要两个285.4.3 设置脚本超级链接脚本链接用于执行JavaScript代码或调用JavaScript函数,能够在不离开当前页面的情况下为浏览者提供有关某项的附加信息。脚本链接还可用于在访问者单击特定项时,执行计算、验证表单和完成其他处理任务。创建脚本链接的方法是,首先选定文本或图像,然后在【属性(HTML)】面板的【链接】文本框中输入文本“JavaScript:”,后面跟一些JavaScript代码或函数调用即可(在冒号与代码或调用之间不能键入空格)。5.4.3 设置脚本超级链接脚本链接用于执行JavaScr295.5 测试和更新超级链接5.5.1测试超级链接5.5.2查找问题链接5.5.3修复问题链接5.5.4自动更新链接5.5.5手工更改链接5.5 测试和更新超级链接5.5.1测试超级链接305.5.1测试超级链接在DreamweaverCS6中,无法通过在文档窗口中直接单击超级链接打开其所指向的文档,但是可以通过以下方法来测试链接。• 在文档窗口中选中超级链接,然后选择菜单命令【修改】/【打开链接页面】,此时将在窗口中打开超级链接所指向的文档。• 按住Ctrl键,同时双击选中的超级链接,也将在窗口中打开超级链接所指向的文档。当然,通过上述方法打开超级链接所指向的文档,必须保证该文档是在本地磁盘上。5.5.1测试超级链接在DreamweaverCS6中,315.5.2 查找问题链接检查链接功能用于搜索断开的链接和孤立文件(文件仍然位于站点中,但站点中没有任何其他文件链接到该文件)。可以检查当前文档、本地站点的某一部分或者整个本地站点中的链接。DreamweaverCS6仅检查验证指向站点内文档的链接,并将出现在选定文档中的外部链接编辑成一个列表,但并不检查验证它们,还可以标识和删除站点中其他文件不再使用的文件。(1) 检查当前文档中的链接。(2) 检查本地站点某一部分中的链接。(3) 检查整个站点中的链接。5.5.2 查找问题链接检查链接功能用于搜索断开的链接和孤325.5.3 修复问题链接在运行链接报告之后,可直接在【链接检查器】面板中修复断开的链接和图像引用,也可以从此列表中打开文件,然后在【属性】面板中修复链接。(1) 在【链接检查器】面板中修复链接。(2) 在【属性】面板中修复链接。5.5.3 修复问题链接在运行链接报告之后,可直接在【链接335.5.4 自动更新链接设置自动更新链接的方法如下。(1) 选择菜单命令【编辑】/【首选参数】,打开【首选参数】对话框。(2) 在【常规】分类的【文档选项】部分,从【移动文件时更新链接】下拉列表中根据需要选择一个选项即可(3) 选择菜单命令【站点】/【管理站点】,打开【管理站点】对话框,选择并打开一个站点。(4) 在【站点设置】对话框中,展开【高级设置】并选择【本地信息】类别,然后选择【启用缓存】选项即可。5.5.4 自动更新链接设置自动更新链接的方法如下。345.5.5 手工更改链接在整个站点范围内手动更改链接的操作方法如下。(1) 在【文件】面板的【本地视图】中选择一个文件(如果更改的是电子邮件链接、FTP链接、空链接或脚本链接,则不需要选择文件)。(2) 选择菜单命令【站点】/【改变站点范围的链接】,打开【更改整个站点链接】对话框。(3) 利用【更改所有的链接】文本框浏览到并选择要取消链接的目标文件,利用【变成新链接】文本框浏览到并选择要链接到的新文件。如果更改的是电子邮件链接、FTP链接、空链接或脚本链接,需要键入要更改的链接的完整路径。5.5.5 手工更改链接在整个站点范围内手动更改链接的操作35网页设计与制作第5章-创建超级链接课件36

超级链接是网站中使用比较频繁的HTML元素,因为网站的各种页面都是由超级链接串接而成,超级链接完成了页面之间的跳转。本章将介绍超级链接的基本知识以及创建超级链接的基本方法。第5章创建超级链接超级链接是网站中使用比较频繁的HTML元素,因为网站37学习目标了解超级链接的概念和分类。掌握设置文本和图像超级链接的方法。掌握设置锚记和脚本超级链接的方法。掌握测试和更新超级链接的方法。学习目标了解超级链接的概念和分类。385.1认识超级链接5.1.1超级链接的概念5.1.2链接路径的类型5.1.3超级链接的分类5.1认识超级链接5.1.1超级链接的概念395.1.1超级链接的概念超级链接习惯简称为超链接,是指从一个网页指向一个目标的连接关系,这个目标对象可以是另一个网页,也可以是一个图像、一个电子邮件地址、一个文件(如Word、Excel、Rar、Zip文件等),甚至是一个应用程序,还可以是相同网页上的不同位置。而在一个网页上用作超级链接的载体对象,可以是一段文本或者是一幅图像,甚至可以是一幅图像的某一部分。当浏览者在浏览器中单击已经设置链接的文本或图像后,链接目标将显示在浏览器窗口中,并且根据目标的类型来打开或运行。超级链接在本质上属于一个网页的一部分,它是一种允许用户同其他网页或站点之间进行交互的元素。各个网页链接在一起后,才能真正构成一个网站。5.1.1超级链接的概念超级链接习惯简称为超链接,是指从405.1.1超级链接的概念在因特网中,每个网页都有惟一的地址,通常称为URL(UniformResourceLocator,统一资源定位符)。URL的书写格式通常为“协议://主机名/路径/文件名”,例如,“/bbs/index.htm”便是网站论坛的URL,而“”省略了路径和文件名,但服务器会将首页文件回传给浏览器。由此可以看出,URL主要用来指明通信协议和地址,以便取得网络上的各种服务,它包括以下几个组成部分。• 通信协议:包括HTTP、FTP、Telnet和Mailto等几种形式。• 主机名:指服务器在网络中的IP地址或域名,在因特网中使用的多是域名。• 路径和文件名:主机名与路径及文件名之间以“/”分隔。5.1.1超级链接的概念在因特网中,每个网页都有惟一的地415.1.2 链接路径的类型绝对路径提供所链接文档的完整的URL,没能任何省略部分,其中包括所使用的通信协议,例如,“/support/dreamweaver/contents.html”。对于图像文件,完整的URL可能会类似于“/support/dreamweaver/images/01.jpg”。在一个站点链接其他站点上的文档时,通常使用绝对路径。文档相对路径是指省略当前文档和所链接的文档都相同的绝对路径部分,而只提供不同的路径部分,例如,“dreamweaver/contents.html”。对于大多数站点的本地链接来说,文档相对路径通常是最合适的路径。站点根目录相对路径描述从站点的根文件夹到文档的路径,站点根目录相对路径以“/”开始,“/”表示站点根文件夹,例如,“/support/dreamweaver/contents.html”。在处理使用多个服务器的大型站点或者在使用承载多个站点的服务器时,可能需要使用这种路径。如果需要经常在站点的不同文件夹之间移动HTML文件,那么使用站点根目录相对路径通常也是最佳的方法。5.1.2 链接路径的类型绝对路径提供所链接文档的完整的U425.1.3 超级链接的分类按照不同的标准,超级链接可以有不同的分类。根据链接载体对象的不同,超级链接通常可分为以下两种。• 文本超级链接:以文本作为超级链接载体。• 图像超级链接:以图像作为超级链接形体。根据链接路径类型的不同,超级链接通常可分为以下两种。• 内部超级链接:链接目标位于同一站点内的超级链接形式。• 外部超级链接:链接目标位于站点外的超级链接形式。外部超级链接可以实现网站之间的跳转,从而将浏览范围扩大到整个网络。5.1.3 超级链接的分类按照不同的标准,超级链接可以有不435.1.3 超级链接的分类根据链接目标对象的不同,超级链接可分为以下几种类型。• 网页超级链接:链接到HTML、ASP、PHP等网页文档的链接,这是网站最常见的超链接形式。• 下载超级链接:链接到图像、影片、音频、Word文档、Excel文档、PowerPoint文档、PDF文档等资源文件或RAR、ZIP等压缩文件的链接。• 电子邮件超级链接:链接到电子邮件的超链接形式,将会启动邮件客户端程序,可以写邮件并发送到链接的邮箱中。• 空链接:链接目标形式上为“#”,主要用于在对象上附加行为等。• 脚本链接:链接目标为一段JavaScript脚本代码,用于执行某项操作。• 锚记超级链接:链接目标为网页文档中的某一位置,这一位置可以位于当前网页或其他网页中,这个网页可以位于当前站点内,也可以位于其他站点内。5.1.3 超级链接的分类根据链接目标对象的不同,超级链接445.2文本超级链接

5.2.1教学案例━━1932年我国首次参加奥运会5.2.2文本超级链接5.2.3下载超级链接和空链接5.2.4电子邮件超级链接5.2.5本超级链接的状态5.2.6设置默认的链接相对路径5.2文本超级链接5.2.1教学案例━━1932年我国455.2.1教学案例━━1932年我国首次参加奥运会将素材文档复制到站点文件夹下,然后根据要求设置超级链接,在浏览器中的显示效果如图5-1所示。(1) 设置网页中文本“奥运会首位中国运动员刘长春”的链接目标文件为“liuchangchun.htm”,打开目标窗口的方式为在新窗口中打开,标题文本为“刘长春”。(2) 设置网页中文本“奥运会首位中国运动员刘长春纪念雕塑”的链接目标文件为“diaosu.htm”,打开目标窗口的方式为在新窗口中打开,标题文本为“刘长春纪念雕塑”。(3) 设置文本“百度”的链接地址为“”,打开目标窗口的方式为在新窗口中打开,标题文本为“到百度检索”。(4) 设置文本“下载图像压缩包”的链接目标文件为“images/images.rar”,标题文本为“下载图像”。(5) 设置文本“反馈给我们”的链接目标为电子邮件地址“us@163.com”,标题文本为“反馈意见或建议”。(6) 设置链接颜色和已访问链接颜色均为“#0CF”,变换图像链接颜色为“#F00”,且仅在变换图像时显示下划线。5.2.1教学案例━━1932年我国首次参加奥运会将素材文465.2.1教学案例━━1932年我国首次参加奥运会5.2.1教学案例━━1932年我国首次参加奥运会475.2.2 文本超级链接一、通过【属性(HTML)】面板创建超级链接。5.2.2 文本超级链接一、通过【属性(HTML)】面板创485.2.2 文本超级链接二、通过【超级链接】对话框创建超级链接。5.2.2 文本超级链接二、通过【超级链接】对话框创建超级495.2.3 下载超级链接和空链接在实际应用中,链接目标也可以是其他类型的文件。如果要在网站中提供资料下载,就需要为文件提供下载超级链接。下载超级链接并不是一种特殊的链接,只是下载超级链接所指向的文件是特殊的,如压缩文件、Word文档或PDF文档等。空链接是一个未指派目标的链接。空链接用于向页面上的对象或文本附加行为。例如,可向空链接附加一个行为,以便在鼠标光标滑过该链接时会交换图像或显示绝对定位的元素(AP元素)。设置空链接的方法很简单,选中文本等链接载体后,在【属性(HTML)】面板的【链接】文本框中输入“#”即可5.2.3 下载超级链接和空链接在实际应用中,链接目标也可50

创建电子邮件超级链接的方法是:选择菜单命令【插入】/【电子邮件链接】,或在【插入】面板【常用】类别中单击【电子邮件链接】按钮,打开【电子邮件链接】对话框进行参数设置。如果要修改电子邮件链接的E-mail,可以通过【属性(HTML)】面板进行设置。通过【属性(HTML)】面板也可以看出,“mailto:”、“@”和“.”这3个元素在电子邮件链接中是必不可少的。为了更快捷地创建电子邮件超级链接,可以先选中需要添加链接的载体,然后在【属性(HTML)】面板的【链接】文本框中直接输入电子邮件地址,并在其前面加一个前缀“mailto:”,最后按Enter键确认即可。5.2.4 电子邮件超级链接创建电子邮件超级链接的方法是:选择菜单命令【插入】/【电子51

通过【页面属性】对话框的【链接(CSS)】分类,可以设置文本超级链接的状态,包括字体、大小、颜色及下划线等。5.2.5 文本超级链接的状态通过【页面属性】对话框的【链接(CSS)】分类,可以设置文52如果要使用站点根目录相对路径创建超级链接,必须首先在DreamweaverCS6中定义一个本地文件夹,作为Web服务器上文档根目录的等效目录,DreamweaverCS6使用该文件夹确定文件的站点根目录相对路径。同时,在【管理站点】对话框中双击打开要设置的站点,展开【高级设置】选项,然后在【本地信息】类别的【链接相对于】选项中选择【站点根目录】单选按钮。5.2.6设置默认的链接相对路径如果要使用站点根目录相对路径创建超级链接,必须首先在Dre535.3图像超级链接5.3.1教学案例━━衰败的城市5.3.2图像超级链接

5.3.3图像热点超级链接

5.3.4鼠标经过图像

5.3图像超级链接5.3.1教学案例━━衰败的城市545.3.1教学案例━━衰败的城市将素材文档复制到站点文件夹下,然后根据要求设置超级链接,在浏览器中的显示效果如图5-24所示。(1) 给图像“01.jpg”添加超级链接,目标文件为“city01.htm”,打开目标窗口的方式为在新窗口中打开,替换文本为“衰败的城市情景1”。(2) 给图像“02.jpg”添加超级链接,目标文件为“city02.htm”,打开目标窗口的方式为在新窗口中打开,替换文本为“衰败的城市情景2”。(3) 给图像“03.jpg”添加超级链接,目标文件为“city03.htm”,打开目标窗口的方式为在新窗口中打开,替换文本为“衰败的城市情景3”。(4) 在图像“baidu.jpg”上创建3个圆形热点超级链接,分别指向文件“/”、“/”、“/”,打开目标窗口的方式均为在新窗口中打开,替换文本分别为“hao123”、“网站导航”、“百度口碑”。(5) 插入鼠标经过图像对象,原始图像为“images/xin01.jpg”,鼠标经过图像为“images/xin02.jpg”,替换文本为“请给我写信”,前往的URL为“mailto:us@163.com”。5.3.1教学案例━━衰败的城市将素材文档复制到站点文件555.3.1教学案例━━衰败的城市5.3.1教学案例━━衰败的城市565.3.2 图像超级链接用图像作为链接载体,这就是通常意义上的图像超级链接。最简单的设置方法仍然是通过【属性】面板来进行。5.3.2 图像超级链接用图像作为链接载体,这就是通常意义575.3.3 图像热点超级链接创建图像热点超级链接的方法是:首先选中图像,然后在【属性】面板中单击热点工具按钮,并将鼠标光标移到图像上,绘制一个区域,并在【属性】面板中设置链接地址、目标窗口和替换文本。5.3.3 图像热点超级链接创建图像热点超级链接的方法是:585.3.4 鼠标经过图像创建鼠标经过图像的方法是,选择菜单命令【插入】/【图像对象】/【鼠标经过图像】,或在【插入】面板的【常用】类别的图像按钮组中单击【鼠标经过图像】按钮,打开【插入鼠标经过图像】对话框,在其中进行参数设置即可。5.3.4 鼠标经过图像创建鼠标经过图像的方法是,选择菜单595.4 锚记和脚本超级链接5.4.1教学案例━━百年前的美丽风景5.4.2创建锚记超级链接5.4.3设置脚本超级链接5.4 锚记和脚本超级链接5.4.1教学案例━━百年前605.4.1教学案例━━百年前的美丽风景将素材文档复制到站点文件夹下,然后根据要求设置锚记超级链接和脚本超级链接,在浏览器中的显示效果如图5-40所示。(1) 在正文中每幅图像上面的说明文本后面依次添加命名锚记“a”、“b”、“c”、“d”、“e”、“f”、“g”。(2) 给“导航:”后面的每个小标题依次添加锚记超级链接,分别链接到正文中相对应命名锚记处。(3) 给文本“打印本页”添加打印功能的脚本链接。(4) 给文本“关闭窗口”添加关闭浏览器窗口功能的脚本链接。5.4.1教学案例━━百年前的美丽风景将素材文档复制到站615.4.1教学案例━━百年前的美丽风景5.4.1教学案例━━百年前的美丽风景625.4.2 创建锚记超级链接创建锚记超级链接,通常需要两个步骤:首先需要命名锚记,即在文档中设置标记,这些标记通常放在文档的特定主题处或顶部,然后在【属性(HTML)】面板中设置指向这些锚记的超级链接。• 创建命名锚记• 创建锚记超级链接5.4.2 创建锚记超级链接创建锚记超级链接,通常需要两个635.4.3 设置脚本超级链接脚本链接用于执行JavaScript代码或调用JavaScript函数,能够在不离开当前页面的情况下为浏览者提供有关某项的附加信息。脚本链接还可用于在访问者单击特定项时,执行计算、验证表单和完成其他处理任务。创建脚

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论