4.2 应用链接
视频讲解
链接存在多种类型，主要是根据链接的对象和位置来划分，具体介绍如下。
4.2.1 实战演练：定义锚点链接
锚点链接是指定向同一页面或者其他页面中的特定位置的链接。例如，在一个很长的页面中，在底部设置一个锚点，单击后可以跳转到页面顶部，这样避免了上下滚动的麻烦。另外，在页面内容的标题上设置锚点，然后在页面顶部设置锚点的链接，这样就可以通过链接快速地浏览具体内容。
【操作步骤】
第1步，启动Dreamweaver CC，打开模板页面temp.html，另存为index.html。
第2步，在编辑窗口中，把光标设置在要创建锚点的位置，或者选中要链接到锚点的文字、图像等对象。
第3步，在属性面板中设置锚点标记的ID，如设置标题标记的ID值为c，如图4.4所示。
图4.4 在属性面板中设置ID
给锚点标记的ID命名时不要含有空格，同时不要置于绝对定位元素内。
提示：要创建锚点链接，首先要创建用于链接的锚点。任何被定义了ID值的元素都可以作为锚点标记，然后就可以设置指向该位置点的锚点链接。这样当单击超链接时，浏览器会自动定位到页面中锚点指定的位置，这对于一个页面包含很多屏时，特别有用。
第4步，在编辑窗口选中或插入并选中要链接到锚点的文字、图像等对象。
第5步，在属性面板的【链接】文本框中输入“#+锚点名称”，如输入#c，如图4.5所示。如果要链接到同一文件夹内的其他文件中，如test.html，则输入test.html#c，可以使用绝对路径，也可以使用相对路径。要注意锚点名称是区分大小写的。
图4.5 设置锚点链接
第6步，保存网页，按F12键可以预览效果，如果单击超链接，则页面会自动跳转到锚点指向的位置，如图4.6所示。
图4.6 锚点链接应用效果
4.2.2 实战演练：定义电子邮箱链接
定义超链接地址为邮箱地址，即为E-mail链接。通过E-mail链接可以为用户提供方便的反馈与交流机会。当浏览者单击邮件链接时，会自动打开客户端浏览器默认的电子邮件处理程序（如Outlook Express），收件人邮件地址被电子邮件链接中指定的地址自动更新。
【操作步骤】
第1步，启动Dreamweaver CC，打开模板页面temp.html，另存为index.html。
第2步，在编辑窗口中，将光标置于希望显示电子邮件链接的地方。
第3步，选择【插入】|【电子邮件链接】命令，或者在【插入】面板的【常用】选项卡中单击【电子邮件链接】选项。
第4步，在打开的【电子邮件链接】对话框的【文本】文本框中输入或编辑作为电子邮件链接显示在文件中的文本，中英文均可。在E-Mail文本框中输入邮件应该送达的E-mail地址，如图4.7所示。
图4.7 设置【电子邮件链接】对话框
第5步，单击【确定】按钮，就会插入一个超链接地址，如图4.8所示。单击E-mail链接的文字，即可打开系统默认的电子邮件处理程序，如Outlook。
图4.8 电子邮件链接效果图
【拓展】
可以在属性面板中直接设置E-mail链接。选中文本或其他对象，在属性面板的【链接】文本框中输入“mailto:+电子邮件地址”，如图4.9所示。
图4.9 在面板中直接设置E-mail链接
也可以在属性面板的【链接】文本框中输入“mailto:+电子邮件地址+?+subject=+邮件主题”，这样就可以快速输入邮件主题，如“mailto:namee@mysite.cn?subject=意见和建议”。在HTML中可以使用<a>标记创建电子邮件链接，代码如下：
<a href="mailto:namee@mysite.cn">namee@mysite.cn</a>
在该链接中多了“mailto：”字符，表示电子邮件，其他基本相同。
4.2.3 实战演练：定义空链接
空链接就是没有指定路径的链接。利用空链接可以激活文档中链接的对象或文本。一旦对象或文本被激活，则可以为之添加行为，以实现当鼠标移动到链接上时进行切换图像或显示分层等动作。有些客户端动作，需要由超链接来调用，这时就需要用到空链接。
在网站开发初期，设计师也习惯把所有页面链接设置为空链接，这样方便测试和预览。
【操作步骤】
第1步，启动Dreamweaver CC，新建文档，保存为test.html。
第2步，在编辑窗口中，选择要设置链接的文本或其他对象，在属性面板的【链接】文本框中只输入一个“#”符号即可，如图4.10所示。
图4.10 设置空链接
第3步，切换到【代码】视图，在HTML中可以直接使用<a>标记创建空链接，代码如下：
<a href="#">空链接</a>