项目7 超链接-Dreamweaver CC 网页设计与制作-游琪-清华大学出版社

图7-4 创建文本超链接
7.7
网页设计基础
任务7.1 创建文本和图像超链接
7.8
图7-5 创建文本超链接
网页设计基础
任务7.1 创建文本和图像超链接
2. 创建图像超链接
➢ 选定图像，在对应的图像属性面板中选用矩形热区工具创建热 区，在属性面板中会出现相应的热区属性面板，使用添加文字 链接相同方法设置热区链接，如图7-6所示。
技能目标：
了解超链接的类型和链接路径 了解超链接的目标 能够创建各类超链接
7.3
网页设计基础
项目任务
任务7.1 创建文本和图像超链接 任务7.2 创建锚点链接页面
7Байду номын сангаас4
网页设计基础
任务7.1 创建文本和图像超链接 任务描述
网页中大部分元素由文本和图像组成，而创建文本和 图像的超链接是网页必不可少的部分。
项目7 超链接
7.1
网页设计基础
项目描述
超链接在本质上属于一个网页的一部分，它是一种允许 同其他网页或站点之间进行连接的元素。各个网页链接 在一起后，才能真正构成一个网站。
通过本次项目的学习，要求熟练掌握超链接的创建及相 关知识。
7.2
网页设计基础
教学目标
知识目标：
了解超链接和链接路径
熟悉在Dreamweaver CC 2018中创建各类超链接
7.11
网页设计基础
任务7.2 创建锚点链接页面
2.设置锚点链接
➢ 选中页面底部的“返回顶部”文字，在属性面板的“链接”文 本框中，输入一个符号“#”和锚记名称，如“#top”, 如图7-9 所示。
图7-9 锚记链接
7.12
网页设计基础
本章小结
超链接是网页的灵魂，没有超链接的网页将是一 潭死水。各个网页只有通过超链接在一起后，才 能真正构成一个网站。
本项目详细介绍了常用网页元素的超链接和锚点 链接的应用。
7.13
网页设计基础
7.10
网页设计基础
任务7.2 创建锚点链接页面
任务实现
1.设置锚点
➢ 打开站点文件夹下的index页面，将光标放置于要设置锚点的 地方（“珠海航空展”前面），然后切换到代码窗口，输入
<a name="top">珠海航空展</a>，在设计窗口可以
看到锚点的标志，如图7-8所示。
图7-8 设置锚点
7.9
图7-6 设置图像热点链接
网页设计基础
任务7.2 创建锚点链接页面
任务描述
锚点链接，（也叫书签链接）常常用于那些内容庞大 繁琐的网页，通过单击命名锚点，不仅能指向文档， 还能指向页面里的特定段落，更能当作“精准链接” 的便利工具，让链接对象接近焦点，便于浏览者查看 网页内容。类似于我们阅读书籍时的目录页码或章回 提示，在需要指定到页面的特定部分时，标记锚点是 最佳的方法。
7.5
网页设计基础
任务7.1 创建文本和图像超链接
任务实现
1. 创建文本超链接
➢ （1）打开站点文件夹中的index页面，在该页面选中文本“最 新资讯”，如图7-3所示。
图7-3 创建文本超链接
7.6
网页设计基础
任务7.1 创建文本和图像超链接
➢ （2）在文本属性面板的“链接”文本框中设定被链接对象的 URL地址（内部链接），如图7-4所示，单击图中“链接”右 则的文件夹按钮，弹出选择链接文件对话框如如图7-5所示， 选定需要链接的文件，单击【确定】按钮，可创建所需要的链 接。