《计算机应用》——超链接教案.docxVIP

计算机应用 PAGE5 / NUMPAGES6 课题 使用超链接 课时 2 教学目标 （1）能说出超链接的分类方法和相应种类。 （2）掌握建立超链接的常用方法。 （3）理解并能建立电子邮件链接。 （4）理解并能建立锚记链接。 （5）会清除不需要的超链接。 教学 重难点 重点 掌握表格的插入和属性设置方法 难点 嵌套表格的设置 课前准备 教师 准备 PPT课件，案例网页，上机环境 学生 准备 熟悉Dreamweaver CC 的界面，掌握软件的基本操作 第一环节 情景导入 小王已经制作好几个网页了，但设计师老张说这些作品还不能叫网页，因为里面缺少一个灵魂——超链接，没有它，网页就是一个个孤立的文件。 在学习创建超链接之前，必须先学习路径的基础知识，只有把路径的知识弄清楚了，才能顺利创建超链接。 第二环节 导入新课 任务1 理解路径的知识 正确描述从链接源所在文档到链接目标之间的文件路径，对创建超链接至关重要。描述方式有三种：绝对路径、文档相对路径和站点根目录相对路径。这三种路径各有特点，灵活使用这些路径能起到事半功倍的效果。 一、绝对路径 绝对路径提供了链接目标文档的完整的 URL 地址。 当需要链接不同站点上的文档时，必须使用绝对路径。如在制作友情链接时，需要链接到另一个网站的网页，这时就要使用绝对路径。 二、文档相对路径 文档相对路径描述了链接源与链接目标之间的相对位置，在网站内部各页面的链接中使用相对路径最合适，因为相对路径不但描述简洁，而且与站点目录所在的位置无关，当站点根目录位置发生改变时，不会影响到站点内链接的网页。 ? 当链接源与链接目标在同一文件夹中时，描述相对路径只需要指明链接目标的文件名即可，例如在index.html中创建指向login.html的链接，可使用相对路径：“login.html”。 ? 当链接源与链接目标在同一文件夹中时，描述相对路径只需要指明链接目标的文件名即可，例如在index.html中创建指向login.html的链接，可使用相对路径：“login.html”。 ? 当链接源与链接目标在同一文件夹中时，描述相对路径只需要指明链接目标的文件名即可，例如在index.html中创建指向login.html的链接，可使用相对路径：“login.html”。 三、 站点根目录相对路径 基于站点根目录的相对路径从站点的根目录开始，通常使用“/”表示根目录，所有基于站点根目录相对路径均以“/”开始，如：/list/cloth.html。 站点根目录相对路径同绝对路径十分相似，只是它略去了绝对路径中的协议部分。通常在站点规模稍大，需要多个设计者合作建设，并且使用模板和组件进行设计时，站点根目录相对路径被广泛使用。 任务2 了解超级链接的分类 超链接按链接目标的不同分为五种类型： 序号 分 类 链 接 目 标 1 网络链接 WWW上的某个Web网站、网页或其他资源 2 本地链接 当前网站中的一个网页或其他资源 3 电子邮件链接 一个电子邮件地址 4 锚记链接 本网页中的一个“锚记” 5 脚本链接 执行JavaScript代码或调用JavaScript函数 超链接按链接目标的不同分为三种类型： 序号 分 类 链 接 目 标 1 文本链接 一个文本，是最基本的链接形式 2 图像链接 一个图像 3 图像映射 图像中包含的各种不同的热点区域，每个热点区域都能链接到一个单独的链接目标上 任务3 超链接的创建 一、使用属性面板创建超链接 选择要作为链接源的文本或图片，在属性面板中会有“链接”文本框、“指向文件”按钮和“浏览文件”按钮。 （1）将链接目标的路径直接输入到链接文本框中可以创建超链接。 （2）单击“浏览文件”按钮可以打开“选择文件”对话框，可以浏览并指定链接目标文档以创建超链接。 （3）单击“指向文件”按钮并拖动到文件面板中的某个文件上，可以将该文件设置为链接目标。 二、 使用“Hyperlink”命令创建超链接 选择要作为链接源的文本或图片，然后打开“插入”菜单，选择“Hyperlink”命令，或者单击插入栏中“常用”类别中的“Hyperlink”按钮，可以打开“Hyperlink”对话框，在对话框里进行相应设置以创建超链接。 任务4 了解超链接的目标窗口 当浏览者单击网页上的超链接后会跳转到链接目标页面。当新页面出现时，可能会出现以下三种情况。 （1）原有的页面被覆盖。 （2）原有的网页不被覆盖，弹出一个新的窗口。 （3）原有的网页内部分内容被替换。 这三种情况的出现是由于对超链接的目标窗口进行了设置。在设置超链接时会有一个“目标”下拉菜单，其中可以设置四种目标 _blank：将文件载入新的无标题浏览器窗口中。 _parent：将文件载入到上级框架集或包含该链接的框架窗口中。 _self：