Dreamweaver给文本旱耐图像添加超链接.docVIP

实验7 给文本和图像添加超链接 实验要求 通过实验，理解链接的概念。熟悉掌握如何给文本和图像添加超链接，如何添加邮件链接和创建锚记链接。 说明：站点是由繁复的链接组成的。因为媒体的其他元素都可以按另一种形式进行复制，但是如果没有了链接，也就不会有万维网。通常，网页设计者需要为短语、单词或者一个图片设置链接，链接到想要到达的地址。一旦用户创建了链接，就可以在浏览器中预览它，实现在网络上的跳转。 对应知识点： ●给文本和图像添加超级链接 ●添加邮件链接 ●创建锚记链接 实验素材 图像和文字制作完成的网页。 实验步骤 启动Dreamweaver MX 2004程序，选择菜单“文件”?“打开”命令，弹出“打开”对话框。在对话框中，选择本书配套光盘exp7/sucai07文件夹中的网页文件page07.htm。如图7-1所示。 单击“按钮”，打开网页文件编辑窗口。如图7-2所示。 　 图７－１“打开”对话框 　　　　　　　　　　　　　图７－２page07.htm网页编辑窗口 说明：此网页主要使用图像和文件制作完成。其中大量使用了表格布局，读者可以打开网页进行分析，回顾关于图像、文本等实验的学习。 首先需要创建本地站点。选择菜单“站点”?“管理站点”命令，打开“管理站点”对话框。选择“新建”?“站点”命令，打开“站点定义”对话框。 在对话框“站点名称”编辑框中输入“广西行”，单击“本地根文件夹”和“默认文件夹”后面的文件夹，选择网页和图像的位置，确定后如图7-3所示。 单击“确定”按钮，返回“管理站点”对话框。新建站点名称“广西行”显示在站点列表中。如图7-4所示。 图7-3“站点定义”对话框 图7-4“管理站点”对话框 图7-5 文件面板 单击“完成”按钮，本地站点创建完成。 Dreamweaver MX 2004将自动打开“文件”面板， 定位到当前站点下。如图7-5所示。 在打开的“page07.htm”文件上制作文字链接。拖动鼠标，选中“我们的宗旨”图像下的第1个小标题“关于广西的介绍”。 单击属性面板“链接”编辑框右侧的“指向文件”按钮 ，拖动鼠标时从“指向文件”图标上会延伸出一条直线，当定位到需要链接的文件（2.htm）后，释放鼠标按钮。文件名和路径信息就会自动显示在“链接”文本框内。如图7-6所示。 图7-6 使用“指向文件”按钮制作文本连接 说明：通过“指向文件”图标 ，用户就不用为了查找一个文件而浏览一个又一个的文件夹，因为现在它们都必须清楚地显示在文件面板上。当然，用户可以指向另一个打开的Dreamweaver窗口中的一个文件，或者同一个窗口中另一个框架中的文件。如果用户需要的链接是一个命名锚，它位于页面的底部。则Dreamweaver 会自动滚动来寻找它。用户甚至可以指向另一个页面的命名锚。 当然，用户也可以单击“浏览文件”按钮 ，打开“选择文件”对话框。在其中选择需要链接的文件“2.htm”。如图7-7所示。 单击“确定”按钮，文件路径和名称显示在“链接”文件框内。 说明：文本链接通常是蓝色并加有下滑线。用户可以改变文档链接的颜色和下滑线状态，在前面实验关于“页面属性”中已有介绍。单击属性面板上的“页面属性”按钮，在“链接”框内可以设置链接的颜色和下划线等状态。如7-8所示。 双击“推出单位”下的第1个名称，选中文字。在属性面板“链接”编辑框内输入此单位的网址（这里假设为）。在目标下下拉列表中选择-black选项。 　　　　　　　　 如图7-9所示。 图7-8在“页面属性”连接框内设置连接状态 图7-9制作网站链接 图7-10制作电子邮件连接 说明 需要注意在制作网站链接时，需要在网址前面加上”http://”。在”目标”下拉列表中有4个选项分别为：-blank在新的未命名的窗口中显示被连接的文档；-parent：在父框架集中显示被连接的文档；-self这是系统默认的设置，是在与该连接相同的框架和窗口中显示被连接的文档；-top在整个浏览器窗口中显示被连接的文档，同时删除原浏览窗口中的内容。 12。在网页的右下方的”联系方式”栏目中，创建 E-mail(电子邮件)连接。拖动鼠标选中E-mail地址，在属性面板“连接”编辑框中输入“mailto:guangxixing@”。如图7-10所示。 说明 电子邮件链接用来方便浏览者与网站设计者之间的沟通。当浏览者点击电子邮件链接时，系统自动打开浏览器默认的电子邮件处理程序。还有一 种创建电子邮件链接的方式，在常用面板上，单击“电子邮件链接”按钮，打开“电子邮件链接”对话框。在其中输入“文本”（显示在网页中的文字）和“E-mail”（电子邮件地址），确定后即可完成电子邮件链接