第十四课 使用超链接实现网页的跳转
问题与任务
怎样在网页之间设置超链接,把网站内各网页组织起来?
本课将根据“走进蝴蝶”网站规划学习利用设置超链接实现网页的跳转。
学习与实践
设置超链接可以链接到网页、网页中的某个位置、网站、电子邮件等,“走进蝴蝶”网站超链接结构如图14-1所示。
“走进蝴蝶”网站结构图
一、建立网页超链接
为“蝴蝶趣事”网页建立超链接以实现不同网页之间的跳转的具体操作步骤如下。
打开素材文件夹“hudie”站点下的网页文件“qushi.html”,选中“蝴蝶之最”文字下的图片,在“属性”面板中单击“链接”文本框右侧的文件夹图标,浏览并选择要链接的网页,单击“确定”按钮即可,如图14-2所示。
图14-2 建立网页超链接
试一试
打开素材文件夹中网页文件“qushi.html”,给文字“蝴蝶定理”和“蝴蝶效应”建立页面超链接,超链接到素材文件夹“hudie\qushi”下的网页文件“dingli.html”和“xiaoying.html”。
练一练
打开素材文件夹中的网页文件“wenhua.html”,给“诗词中的蝴蝶” “书画中的蝴蝶” “蝴蝶艺术品” “蝴蝶结”栏目建立页面超链接,超链接到相关栏目。
?想一想 如何在交替显示的图像上插入超链接?
选中图片→“属性”→“链接”文本框右侧的文件夹图标,浏览并选择要链接的网页,单击“确定”按钮即可
讨论 在网页中设置超链接到视频文件与插入视频文件的预览效果有何不同?
超链接的文件窗口可大可小,插入的视频文件窗口大小固定且不可以调整。
二、建立锚点链接
网站中有些网页很长,需要拖动浏览器的滑动条才能浏览网页的完整信息,锚点就可以很好地解决这个问题。在网页中加入锚点并建立一个超链接,就可以迅速地定位到我们想要浏览的位置。建立锚点链接首先要在网页的某一位置插入命名锚记,然后再建立锚点链接。在网页中建立锚点链接的具体操作步骤如下。
(1)打开素材文件夹的网页文件“jiben.html”,将光标定位到文字“蝴蝶”前,执行“插入→命名锚记”命令,如图14-3所示。
图14-3 插入命名锚记
(2)在弹出的“命名锚记”对话框中输入锚记名称“jianjie”,单击“确定”按钮,如图14-4所示。
图14-4命名锚记
(3)选中网页中标题文字“蝴蝶简介”,在“属性”面板“链接”文本框中输入“#jianjie”,链接到对应的锚点,即可建立锚点链接,如图14-5所示。
图14-5 建立锚点链接
注意:要在英文输入法状态下输入“#jianjie”,“#”与“jianjie”之间不要有空格。
讨论 在插入命名锚记之后,插入点有什么变化?
变色
试一试 给网页文件“jiben.html”中的“蝴蝶的生长发育”“蝴蝶的形态特征” “蝴蝶的生活习性”建立错点链接。
?想一想 锚点链接与Word的书签链接有什么异同?
都是超链接。锚链接要先在网页的某一位置插入命名锚记。
三、链接到其他网站
建立不同网站之间的网页超链接可以实现网站之间的跳转。“走进蝴蝶”网站可与其他网站之间建立超链接,具体操作步骤如下。
打开素材文件夹中的网页文件“gongyuan.html”,选中“成都华希昆虫博物馆”图片后,在“属性”面板的“链接”框中输人网址“http://asia-insect.com”,单击“确定”按钮,即可完成链接任务,如图14-6所示。
图14-6 建立不同网站之间的超链接
试一试
打开素材文件夹的网页文件“gongyuan.html”,
给中山市博物馆、上海自然博物馆、国家动物博物馆建立相应的网站链接。
中山市博物馆网址: http://www.zsmuseum.cn
上海自然博物馆网址:http://www.snhm.org.cn/
国家动物博物馆网址:http://www.nzmc.org/
练一练
打开素材文件夹的网页文件“jiben.html”,给网页中文字“联系我们”添加电子邮件超链接。
思考与练习
给自己设计的网站画出网站链接结构图,并建立合适的网页超链接、锚点链接、电子邮件超链接等。
课堂小结
这节课,我们通过学习并练习建立网页超链接,
建立锚点链接和链接到其他网站,实现了使用超链接跳转网页的愿望,提高了信息技术素养,体验到了合作探究学习的乐趣!