第4讲 创建超级链接

第6讲创建超级链接主要内容理解URL地址理解和编写绝对路径和相对路径超链接的概念以及类型设置下载文件的超链接热点区域链接重点：设置各种超链接类型难点：路径的书写1、理解URL地址URL（UniformResourceLocator）统一资源定位符，它通过提供一种标准的访问方式，以便能在Internet上找到你所请求的任何东西。它主要包含五个部分内容，具体格式：访问协议://服务器名:端口号/文件路径/具体请求的文件名称例如：具体每个模块说明如下：访问协议：用户发出请求所用到的网络协议，一般包含：http（超文本传输协议）,ftp（文件传输协议）,news（新闻网络协议）,telnet（远程访问协议）等；服务器名：用户所请求的内容所存储的位置，可以是域名或IP地址；端口号：http协议默认的端口号为80，ftp默认的端口号为21，具体的端口号可通过在服务器上进行修改设置，如果采用默认端口号那么在访问时可省略；文件路径：指用户具体请求的页面所在服务器上的具体路径；具体请求的文件名称：就是用户所要看到的页面的文件名称。2、理解和编写绝对路径和相对路径文档路径的类型：绝对路径、和根目录相对的路径、和文档的相对的路径(1)绝对路径：是包含服务器协议的完全路径，它是一个精确地址，一般用来创建对当前站点以外文件的链接。例如：Internet网址：本机地址：D:\网页制作\Dreamweaver\images\wuyishan.jpg(2)和根目录相对的路径：是从当前站点的根目录开始，站点上所有可公开的文件都存放在站点的根目录下，使用斜杠（/）作为其开始路径。例如：/dreamweaver/index.htm(3)和文档相对的路径：是指和当前文档所在的文件夹相对的路径。例如：File.htm指定的是当前文件夹内的文档，../file.htm指定的则是当前文件夹上级目录中的文档，htmldocs/file.htm则指定了当前文件夹下htmldocs文件中的文档。注意：在创建和文档相对的路径之前一定要保存新文件，因为在没有定义起始点的情况下，和文档相对的路径是无效的，在文档为被保存之前，Dreamweaver会自动使用以file://开头的绝对路径。3、超链接的概念以及类型超链接是网页之间联系的桥梁，浏览者通过它可以跳转到其他页面，可以说超链接是整个网站的“灵魂”。一般来讲，超级链接包含以下类型：文档链接：连接到其他文档，是最为常用的类型，也是我们在网络上看到最多的一种；书签链接：也称“锚点”链接，链接到相同文档或不同文档的页面中的某个位置；电子邮件链接：创建允许用户给网页制作人员发送邮件的链接；空链接：指连接的内容为空的，通常用来附加Dreamweaver行为；脚本链接：通常用来链接到执行JavaScript代码或调用JavaScript函数。（1）创建文档或图片超链接在站点内创建超链接的方法：a.使用属性面板，键入文件路径或浏览硬盘上站点内的文件；b.使用“指向文件”图标直接指向要链接的文件；c.使用“资源”面板创建或修改超链接。具体操作过程，请认真看演示，注意在制作超链接时你所选择的点击对象，一般可以选择文字、图片、flash、按钮等。设置超链接的目标窗口：在属性面板中“目标”的取值如下：a._blank将文件载入新的无标题浏览器窗口中；b._parent将文件载入到上级框架集或包含该链接的框架窗口中；c._self将文件载入到相同框架或窗口中；d._top将文件载入到整个浏览器窗口中，将取消所有框架。添加超链接的文本提示：切换到“代码”模式，在超链接的代码ahref=”file.htm”target=”_blank”超链接/a中添加标签a的文本提示属性title，如：ahref=”file.htm”target=”_blank”title=”这是一个超链接”超链接/a（2）电子邮件链接在属性面板中的“链接”输入“mailto：电子邮件地址”，注意：在mailto:后面不能有空格，如输入“mailto:[e-mail]”，也可输入电子邮件的主题或抄送等，如输入mailto:[e-mail]?subject=建议&cc=[e-mail]，各参数具体含义如下：subject为所发送邮件的主题，cc为要抄送的电子邮件地址，其中，?表示分隔，&表示连接。（3）书签链接（锚点连接）a.页内跳转，即该链接是跳转到同一页面的不同位置。具体实现步骤如下：1.在需要跳转到的位置插入锚点标记，如设置锚点标记名称为“mao”；2.在所做的超链接的属性面板“链接”属性中输入如：#mao。注意：#与锚点之间不能有空格，否则链接将失败。b.页间锚点跳转，指链接到不同页面的不同位置，具体步骤与页内跳转一样，差别在于最后输入的“链接”的属性的值应如下：file.htm#mao。（4）空链接空链接一般分为两种形式：“#”和“JavaScript:;”两者的区别在于：空链接为：“#”则在点击是会跳转到页面的顶部，通常我们在开发过程中使用到的“返回页首”的链接就是这样的空链接；空链接为：“JavaScript:;”那么该链接不会实现任何跳转，此时该空链接一般用于行为的调用。（5）脚本链接通过JavaScript脚本链接，可以执行JavaScript代码或调用JavaScript函数，通常用来在用户单击时执行计算、标单验证和其他处理任务。如如果要实现当用户点击是弹出一个警告之类的窗口，那么就可以通过调用alert函数来实现具体操作如下：在要做弹出窗口的文字链接的属性面板中，在“链接”中输入：javascript:alert(‘欢迎来到武夷山！’)；其中：javascript:表示这是一个javascript的函数，后面紧跟的是函数名称，括号内为函数的参数，注意因为javascript代码出现在双引号之间，所以参数必须用单引号或在双引号之前加斜杠否则将出错。4.设置下载文件的超链接通常情况下，当你所创建的超链接所链接的文件是浏览器默认无法打开时，则服务器将提示你下载。通常我们在开发过程可以把将要提供用户下载的文件压缩成zip或rar的文件。5.热点区域链接热点区域链接指可以将一张图片划分为多个区域，区域类型一般有矩形、圆、多边形等，不同的区域可以设置不同的链接内容。具体请认真看演示过程。作业：1.分析URL地址2.举例说明并比较绝对路径和相对路径3.熟悉设置超链接的步骤实验内容：请模仿网易新闻网：，设计一个页面，并在该页面中设置不同的超链接类型