《超级链接的应用》PPT课件

2019/5/9
中原工学院信息商务学院计科系
14
由斜线、冒号、散列符号分隔。
超文本传输协议（HTTP）：以访问资源的 方式来寻找Web服务器的方式。
Fra Baidu bibliotek
2019/5/9
中原工学院信息商务学院计科系
3
7.1.2 路径的概念
在网页中，最常用的链接对象是链接路径。 链接路径分为绝对路径和相对路径。
绝对路径是一个完整的路径地址，如： http://www.zcib.edu.cn/index.aspx ；
第七章
超级链接的应用
2019/5/9
中原工学院信息商务学院计科系
1
7.1 超级链接概述
超链接是网页中重要组成部分，利用它不仅可以链 接到其他网页，还可以链接到其他图像文件、多媒 体文件及下载程序，也可以利用它在网页内部进行 链接或是发送E-mail等。在Dreamweaver中， 可以将文档中的任何文字及任意位置的图片设置为 超链接。
超链接分类：按照链接路径的不同，网页中超链接 一般分为: 内部链接，锚点链接和外部链接。按照 使用对象的不同，网页中的链接又可以分为：文本 超链接，图像链接，E-mail链接，文件链接，空 链接，脚本链接等。
2019/5/9
中原工学院信息商务学院计科系
2
7.1.1 URL的概念
URL代表全球资源定位器，其功能提供一 种在Internet上查找东西的标准方法。
脚本链接：是指链接对象是一段JavaScript脚本或一 个JavaScript函数名的链接 。使用这种链接，我们 可以调用一段JS脚本，以实现某些特殊效果。
点击链接后的弹出窗口
Javascript:alert(‘……’)
2019/5/9
中原工学院信息商务学院计科系
10
7.3 创建图像映射链接
<a
代码
href="mailto:a1234514@16
3.com">我的邮箱</a>
空链接：是指链接对象是一个#的链接。有的时候，链 接对象还未确定，又想让元素显示为链接时，可以使 用它。当点击空链接时，某些浏览器可能会跳到页面 的顶部。
2019/5/9
中原工学院信息商务学院计科系
9
创建脚本链接
如果只想给图像的某些区域添加链接，点击不同的区
域可以打开不同的链接，这样的链接就叫做图像热点
链接，图像的带链接的区域就称为热点。选中要创建
图像热点链接的图像，在【属性】面板的如下区域进
行设置：
创建图像热点链接的工具
以上四个按钮从左到右，分别为如下工具：
选择工具：可以对热点区域进行选择和调整；
第二步：链接到的刚创建的命名锚点
创建一个普通的超链接，将【链接】文本框的值设置为：#+刚才创 建的锚点名称（#to_logo）就可以了。
2019/5/9
中原工学院信息商务学院计科系
8
创建Email链接和空链接
E-mail链接：是指链接对象是一个E-mail地址的链
接。
点击
设置E-mail链接的属性
相对路径是指该文件相对于某一参照物的路径地址， 在网页中，我们使用..表示上一级目录， 如../index.html 是个相对路径。
2019/5/9
中原工学院信息商务学院计科系
4
7.2 创建超级链接
文档链接 锚点链接 E-mail链接 脚本链接 空链接 下载文件链接
2019/5/9
中原工学院信息商务学院计科系
5
创建普通超链接
点击
绝对路径
创建文本链接
效果图
相对路径
选择
2019/5/9
中原工学院信息商务学院计科系
相对于Untitled1.html这个网页
6
创建普通超链接
目标属性（target）的四个值：
_blank：在新窗口打开链接；
_self：在原窗口打开链接；（默认值）
_top：在整个窗口中打开链接，在有框架的页面中才有效果， 否则效果和_self看到的一样；
_parent：在父框架中打开链接，如果含有该链接的框架不 是嵌套的，则效果_top。
说明：图像超链接本质就是将<a>的元素内容 由文本替换为图像而已，我们可以直接选中图 像后，在【属性】面板中对【链接】和【目标】 两栏进行设置就可以为图像设置超链接了。
距形 热点
圆形 多边形热点 热点
图像左上角的坐标是（0,0）
2019/5/9
中原工学院信息商务学院计科系
13
创建图像热点链接
上图的HTML代码：
<img src="main.jpg" width="323" height="141" border="0" usemap="#Map" /> <map name="Map" id="Map"> <area shape="rect" coords="4,62,118,83" href="http://www.zcib.edu.cn" target="_blank" alt="这是教学楼 " /> <area shape="circle" coords="166,114,23" href="#" /> <area shape="poly" coords="313,60,244,58,201,58,198,79,224,79,227,90,291,84,3 11,85" href="#" /> </map>
矩形工具按钮：绘制一个矩形的热点区域；
2019/5/9
中原工学院信息商务学院计科系
11
创建图像映射链接
创建图像热点链接的工具
圆形工具按钮：绘制一个圆形的热点区域；
多边形工具按钮：绘制一个不规则多边形的热点区 域。
2019/5/9
中原工学院信息商务学院计科系
12
创建图像热点链接
用选择工具选中相应的热点区域后， 即可在【属性】面板设置它的链接 地址等信息
2019/5/9
中原工学院信息商务学院计科系
7
创建锚点链接（书签链接）
它用于那些内容庞大繁琐的网页，通过点击命名锚点， 不仅让我们能指向文档，还能指向页面里的特定段落， 让链接对象更加精准、细粒度化，便于浏览者查看网 页内容。
第一步：在需要链接到的位置处创建命名锚点
点击
设置锚点名字
代码
<a name="to_logo" id="to_logo"></a>