第6章 网页中的超级链接
6.1任务题目
灵活运用链接知识建立各种超级链接
6.2 任务导入
  如何使一个个独立的网页彼此联系起来，又如何使这些独立的网页和其他网站联系起来呢？这就需要使用超链接。通过超链接，把Internet上的众多的网站和网页联系起来，构成一个有机整体。在Internet上浏览，实际上就是通过在页面上单击链接，从当前页面跳转到另一个页面。本章主要介绍各种超链接工具的使用，在建立和设置超链接属性的同时，运用超链接知识制作出灵活跳转的各个链接页面。
6.3 任务分析
1．目的
（1）掌握简单超链接的设计能力。
（2）掌握各种链接的创建及属性设置。
2．重点
（1）掌握超链接的概念。
（2）掌握内部超链接、外部超链接创建方法及设置。
（3）掌握E-mail链接创建方法及设置。
（4）掌握锚点链接创建方法及设置。
（5）掌握图像映射链接的创建及设置。
3．难点
（1）掌握如何设置链接目标。
（2）掌握锚点链接的创建及设置。
（3）掌握图像映射链接的创建及设置。
6.4 技能目标
1．根据任务要求，能设计网页的简单超链接。
2．根据网页效果需要，能合理运用超链接属性进行参数设置。
6.5 任务讲析
6.5.1 实例演练——奥运网页超级链接的制作
【任务一】
设计思路
◆打开网页
1．在D盘创建新文件夹名为“任务6-1”，作为站点文件夹用于存放站内的文档。
2．启动Dreamweaver CS4软件，进入Dreamweaver CS4主窗口中，单击菜单【文件】>【打开】，弹出【查文件】对话框，打开“光盘/素材/第6章/任务1/index.html”。
◆设置内部超级链接html网页设计超链接[1]
1．选中页面里的文字“奥运动态”，然后执行【插入】>【超级链接】命令，如图6-1所示，弹出【超级链接】对话框，如图6-2所示。
图6-1应用菜单命令插入超级链接
图6-2“超级链接”对话框
2．单击图6-2面板上【链接】项右边的文件夹图标，打开【选择文件】对话框，在该对话框中选择“光盘/素材/第6章/任务1/ ch6-11.html”。在面板上的【目标】下拉列表框中选择一个链接的打开方式，选择打开方式为“＿blank[2]”，设置如图6-3所示。
图6-3超级链接设置
3．单击【确定】按钮，在文档中可以看到文字“奥运动态”显示为蓝，并且在“奥运动态”下面自动生成了下划线，说明“奥运动态”超级链接已经建立，如图6-4所示。
图6-4超级链接设置完毕后文档效果
4．保存并预览网页，当鼠标移动到文字“奥运动态”时，鼠标样式为手形。如图6-5所示。单击打开另一个网页“ch6-11.html”。
图6-5鼠标移动到链接字体上时状态
◆创建外部超级链接
1．如图6-6所示，选中“index.html”文档中的 “友情链接”四个字。
图6-6选择外部超级链接文字
2．在链接【属性】面板中对【链接】和【目标】属性进行设置。设置内容如图6-7所示。
图6-7设置外部链接地址
◆创建邮件链接[3]
1．在文档中选中文字“”,然后在其【页面属性】面板【链接】项文本框中里直接输入E-mail链接地址“mailto:lncc_teach@163”, 【属性】面板显示如图6-8所示。
图6-8属性面板中的链接
2．设置完毕后，文档窗口中的“”显示下划线，并且字体颜显示为蓝，即完成了一个E-mail链接。如图6-9所示。
图6-9邮件链接
◆创建锚点链接[4]
1．打开“光盘/素材/第6章/任务1/ ch6-11.html”文档，将插入点置于第一篇文章标题 “一、“播撒和平友谊”——刘淇致函慰问火炬接力运行团队”前面，如图6-10所示。
图6-10光标定位
执行【插入】>【命名锚记】命令或单击【插入】栏的【常用】类别中的【命名锚记】按钮，如图6-11所示。
图6-11单击“命名锚记”按钮
2．弹出【命名锚记】对话框，在【锚记名称】文本框中输入锚记名称为“article1”,如图6-12所示。
图6-12“命名锚记”对话框
3．单击【命名锚记】对话框上的【确定】按钮，则在页面中光标所在位置插入一个锚记图标，如图6-13所示。
图6-13插入锚记图标
提示:如果需要重新定义锚记名称的话，可以在页面中单击选中锚记图标，在【属性】面板上对锚记名称重新定义，如图6-14所示。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。