使用DW在网页中建立各种超级链接.ppt

使用Dreamweaver在网页中建立各种超级链接 使用文本 图像等最基本的网页元素制作了一个较简单的 个人主页 超级链接 知识回顾 什么是URL 什么是超级链接 什么是绝对路径 什么是相对路径 为 个人主页 网站创建各种超级链接 将网页左侧导航栏中的 动画 图片 梦想 分别链接到本网站中的animation html picture html dream html等页面 为网页中的 下载 链接到下载文件 pictrue rar 为网页左侧导航栏中的 关于 添加超级链接 为网页中的tom369 建立一个E mail链接 为picture html中页首的小图片添加链接 当单击页面中的某个小图片时便会跳转到该页面的相应网页 2 1内部链接 操作步骤 第一步 在网页中选中要作为超级链接的文本 第二步 为指定的文本创建超级链接 选中 动画 单击属性面板中的 链接 文本框后面的按钮 打开 选择文件 对话框 选中 animation html 即可动画第三步 保存网页 按F12键预览网页 超级链接 下载文件说明 将下载文件music rar设置为站点根目录目录下的文件 选中页面中的 下载 文本 代码中插入下载 2 2外部链接 实现步骤 选中 新闻 文本 在属性面板上的 链接 文本框中输入完整的网址关于注意 输入的网址必须是绝对路径 如何在新的浏览窗口中打开链接文件 使用target属性友情链接在DW中只需要在属性面板中的 目标 下拉列表中选择 blank target属性可以定义被链接的文档在何处显示 blank 表示单击该链接会重新启动一个浏览器窗口载入被链接的网页 parent self top 的具体含义和框架有关 2 3创建E mail链接 单击E mail链接时 将立即打开浏览器默认的E mail处理软件 且收件人的邮件地址由E mail链接中指定的地址自动设置 实现步骤 选中tom369 文本 添加E mail链接的方法单击 插入面板 中的电子邮件链接按钮 或者选择菜单 插入 电子邮件链接 在出现的对话框中输入相应的电子邮件即可 代码如下 tom369 在属性面板上的 链接 文本框中直接输入 mailto tom369 2 5创建空链接 要想对文本或图像等对象设置行为 首先必须为文本建立空超级链接 空超级链接是一个未指派目标的超级链接 这样行为才会有效 为文本建立空超级链接时 只要先在文档窗口中选中需要建立空超级链接的文本 然后在属性面板的 链接 文本框中输入一个 符号即可 建立空超级链接的目的只是为了应用行为 其他情况下不必建立 2 6设置链接颜色 为文本添加了超级链接之后 文本具有几种颜色状态 未访问过链接的文本颜色 已访问链接的文本颜色已经当前正在访问的链接的文本颜色 可以通过设置 页面属性 来改变各种链接状态下的文本颜色 鼠标放上去时文字的颜色 2 7制作图像映射 图像映射就是指在一幅图像中定义若干个区域 这些区域称为热区 每个区域中指定一个不同的超链接 当单击不同区域时可以跳转到相应的目标页面 实现步骤 制作热区为热区添加超级链接编辑热区 实现图像映射的HTML代码 2 8其他链接形式 1制作鼠标经过图像鼠标经过图像就是指当访问者移动鼠标使鼠标指针经过图像时 图像变为另一幅图像 而鼠标指针离开时 图像又恢复为原始图像 这种效果通常用于导航条 图像互动等 它由两幅图像组成 一是首次载入时显示的图像即原始图像 二是鼠标经过后翻转的图像即鼠标经过图像 在创建鼠标经过图像时应使用相同大小的两幅图像 如果这两个图像大小不同 Dreamweaver将自动调整第二个图像的大小以匹配第一个图像的属性 制作步骤 在插入面板或插入菜单中打开 鼠标经过图像 对话框选取原始图像和鼠标经过图像保存网页 课下练习 创建你的个人主页实例演示