网页设计与制作实用教程电子教案教学建议第4章在网页中建立各种超级链接课件

《网页设计与制作实用教程电子教案教学建议第4章在网页中建立各种超级链接课件》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、网页设计与制作实用教程主编：刘艳丽　副主编：许晞秦高德高妍学习目标掌握内部、外部超级链接的创建方法；掌握E-mail链接的创建方法；掌握锚点链接的制作方法；掌握链接颜色的设置方法；了解图像映射的制作方法；了解跳转菜单、翻转图像实例、导航栏的制作方法。6/30/20212第4章　在网页中建立各种超级链接目录超级链接应用实例锚点链接应用实例热区链接应用实例导航栏实例本章小结配套实训练习题6/30/20213第4章　在网页中建立各种超级链接超级链接应用实例设计目标页面分析实训引导制作步骤6/30/20214第4章　在网页中建立各

2、种超级链接设计目标在第3章实例index.htm的基础上，制作一个具有超级链接的网页。其浏览效果如图4.1所示。当鼠标移到栏目标题文本上时就会变成手形，同时在浏览器下方的状态栏中显示链接地路径，单击时便会跳转到相应的链接内容。返回6/30/20215第4章　在网页中建立各种超级链接页面分析该页面包含了如图4.1所示的各种超级链接，如内部超级链接、外部超级链接、空链接和脚本链接、Email超级链接等。（教程P52）返回6/30/20216第4章　在网页中建立各种超级链接实训引导1．本实例在第3章制作页面的基础上添加各种超级链

3、接。2．各个栏目文本所对应的链接网页文件由配套光盘webcoursechapter04materials文件夹提供，请将这些所要链接的文件复制到本地站点的webpages文件夹下。3．页面效果请参见配套光盘webcoursechapter04文件夹下的index4.html文件。返回6/30/20217第4章　在网页中建立各种超级链接制作步骤在本地站点future中打开第3章制作的index.html页面，依次按照下述内容在页面中创建各种超级链接。1．创建内部超级链接；2．创建外部超级链接；3．创建空链接和脚本链接；

4、4．创建E-mail超级链接；5．设置链接颜色。返回6/30/20218第4章　在网页中建立各种超级链接创建内部超级链接使用不同的方法分别为栏目文本创建内部超级链接。操作步骤见教程P53。在新的浏览器窗口中打开“未来都市”网页，操作步骤见教程P55。6/30/20219第4章　在网页中建立各种超级链接创建外部超级链接将“友情链接”文本链接到“Google”网站。操作步骤见教程P56。6/30/202110第4章　在网页中建立各种超级链接创建空链接和脚本链接为“未来通讯”文本创建空链接，操作步骤见教程P57。为“clo

5、se”文本创建脚本链接，效果如图4.8所示。操作步骤见教程P57。6/30/202111第4章　在网页中建立各种超级链接创建E-mail超级链接在网页index.html的页脚中，为“联系我们”文本创建E-mail链接，其E-mail地址为“teach_ie@163.com”。操作步骤见教程P57。6/30/202112第4章　在网页中建立各种超级链接设置链接颜色在网页index.html中，设置链接颜色，效果如图4.13所示。操作步骤见教程P59。返回6/30/202113第4章　在网页中建立各种超级链接锚点链接应用

6、实例设计目标实训引导制作步骤6/30/202114第4章　在网页中建立各种超级链接设计目标返回6/30/202115第4章　在网页中建立各种超级链接实训引导（1）本实例的素材网页文件ex4_city.html由配套光盘webcoursechapter04materials文件夹提供，请将该文件复制到本地站点futurewebpages文件夹下。（2）页面效果请参见配套光盘webcoursechapter04result文件夹下的ex4_city.html文件。返回6/30/202116第4章　在网页中建立各种超级

7、链接制作步骤（1）在页面中插入锚点：如图4.15所示，在正文“一、从超大城市到巨型城市”之前插入命名锚点，操作步骤见教程P61。按照上述方法，分别在其余每篇文章的标题前插入命名锚点（锚点名分别为article2、article3、article4、article5）。操作步骤（略）。（2）为锚点建立链接。将页首目录中“一、从超大城市到巨型城”文本链接到“article1”锚点，操作步骤见教程P62。按照上述方法，分别将目录中的其余文本链接到文章前的相应锚点article2、article3、article4、ar

8、ticle5。操作步骤（略）。设置返回页首链接，操作步骤见教程P62。返回6/30/202117第4章　在网页中建立各种超级链接热区链接应用实例设计目标页面分析实训引导制作步骤6/30/202118第4章　在网页中建立各种超级链接设计目标制作一个浏览效果如图4.18所示的效果。当鼠标移上图像的不同组成