创建链接和导航课件.ppt

1、 四四.创建链接和导航创建链接和导航 四.创建链接和导航 1.1.认识绝对路径和相对路径认识绝对路径和相对路径 2.2.创建和管理链接创建和管理链接 3.3.创建跳转菜单创建跳转菜单 4.4.创建导航条创建导航条 5.5.创建图像地图（图像热点）创建图像地图（图像热点）1.绝对路径和相对路径（超）链接是网页的灵魂，它合理、协调地把超）链接是网页的灵魂，它合理、协调地把网页中的众多页面通过链接构成一个有机整体，网页中的众多页面通过链接构成一个有机整体，是访问者能访问自己想去的地方。超级链接可是访问者能访问自己想去的地方。超级链接可以是一段文本，一幅图像、或其它网页元素。以是一段文本，一幅图像、或

2、其它网页元素。当在浏览器用鼠标单击这些对象时，浏览器就当在浏览器用鼠标单击这些对象时，浏览器就会根据其指示载入一个新的页面或者跳转到页会根据其指示载入一个新的页面或者跳转到页面的其它位置面的其它位置。在在DWDW中，链接路径可以使用中，链接路径可以使用3 3种表示方式：种表示方式：绝对路径绝对路径、相对路径相对路径和基于根目录的路径和基于根目录的路径。1.绝对路径和相对路径（1 1）绝对路径）绝对路径 在链接中，绝对路径提供了链接文档的完整在链接中，绝对路径提供了链接文档的完整 的的URLURL地址，包括所使用的传输协议（对于网地址，包括所使用的传输协议（对于网 页通常是页通常是http:/h

3、ttp:/）。）。在创建外部链接（从一个网站链接到另一个在创建外部链接（从一个网站链接到另一个 网站）时，也就是说网站）时，也就是说链接不同站点上的文链接不同站点上的文 档档，必须使用绝对路径。例如：，必须使用绝对路径。例如：http:/http:/ 1.绝对路径和相对路径（2 2）相对路径）相对路径和当前文档所在的文件夹相对的路径和当前文档所在的文件夹相对的路径，是以源，是以源文档所在位置为起点到被链接文档经由的路径。文档所在位置为起点到被链接文档经由的路径。这是用于本地链接的最适宜的路径。当用户要这是用于本地链接的最适宜的路径。当用户要把当前文档与处在相同文件夹中的另一文档链把当前文档与处

4、在相同文件夹中的另一文档链接，或把同一网站下不同文件夹中的文档相互接，或把同一网站下不同文件夹中的文档相互链接时，就可以使用相对路径。如链接时，就可以使用相对路径。如dw/content.htmldw/content.html。“.”.”符号可以用来表示当前位置的父级目符号可以用来表示当前位置的父级目录录././abc.htmabc.htm;./abc/abc.htm./abc/abc.htm;././././abc.htmabc.htm 1.绝对路径和相对路径（3 3）根目录相对路径）根目录相对路径 指从站点文件夹到被链接文档经由的路径。指从站点文件夹到被链接文档经由的路径。一一个根相对路径

5、以前斜杠开头个根相对路径以前斜杠开头，如，如/support/support/tips.htmtips.htm就是根文件夹下的就是根文件夹下的supportsupport子文件夹下的一个文件子文件夹下的一个文件tips.htmtips.htm的根相对路径。的根相对路径。根目录相对路径同样适合用于创建内部链接，根目录相对路径同样适合用于创建内部链接，但不建议使用。但不建议使用。根目录相对地址只能由服务器根目录相对地址只能由服务器来解释来解释，所以在自己计算机上打开一个带有根，所以在自己计算机上打开一个带有根目录相对地址链接的网页，上面的链接是无效目录相对地址链接的网页，上面的链接是无效的。的。1

6、.绝对路径和相对路径注意问题：注意问题：(2)(2)相对路径是最适合网站的内部链接。只要是相对路径是最适合网站的内部链接。只要是 属于同一网站之下的，即使不在同一个目录属于同一网站之下的，即使不在同一个目录 下，相对链接也非常适合。当使用相对路径下，相对链接也非常适合。当使用相对路径 时，如果在时，如果在DWDW中改变了某个文件的存放位中改变了某个文件的存放位 置，不需要手动修改链接路径，置，不需要手动修改链接路径，DWDW会自动更会自动更 改链接。改链接。(2)(2)在创建相对路径之前一定要先保存新文档在创建相对路径之前一定要先保存新文档，因为在没有定义起始点的情况下，相对路径因为在没有定义

7、起始点的情况下，相对路径 是无效的。在文档被保存之前，是无效的。在文档被保存之前，DWDW会自动使会自动使 用以用以file:/file:/开头的绝对路径开头的绝对路径 2.创建和管理链接在创建，最好先定义好站点。在在创建，最好先定义好站点。在DWDW中可以用多中可以用多种方法创建超链接，以下是常用几种：种方法创建超链接，以下是常用几种：使用属性面板的使用属性面板的“浏览文件浏览文件”选择文本或图像，选择链接文件，目标文件选择文本或图像，选择链接文件，目标文件 的打开方式的打开方式_blank/_parent/_self/_top_blank/_parent/_self/_top使用属性面板中

8、的指向文件图标创建链接使用属性面板中的指向文件图标创建链接右键快捷菜单创建链接右键快捷菜单创建链接直接拖动直接拖动直接插入直接插入 可以给链接增加提示，给链接增加快捷键可以给链接增加提示，给链接增加快捷键 2.创建和管理链接链接种类链接种类1 1）页间跳转：相对路径）页间跳转：相对路径2 2）页内跳转（创建锚点链接）：）页内跳转（创建锚点链接）：链接到文档中的指定位置。链接到文档中的指定位置。创建锚点创建锚点 使用链接到锚点位置：使用链接到锚点位置：ancharanchar、index.htmlindex.htmlancharanchar 2.创建和管理链接3 3）空链接：是一个无指向的链接。

9、）空链接：是一个无指向的链接。使用空链接可以为页面上的对象或文本附加行使用空链接可以为页面上的对象或文本附加行为。在属性面板的链接框中，只输入一个为。在属性面板的链接框中，只输入一个“#”#”号。如果单击这种地址为一个号。如果单击这种地址为一个“#”#”的链接，无的链接，无论当前你处于文档的什么地方，都会自动跳转论当前你处于文档的什么地方，都会自动跳转到文档的开头位置。到文档的开头位置。如果不想出现这种自动跳转到文档开头的情况如果不想出现这种自动跳转到文档开头的情况可以安装插件进行处理。可以安装插件进行处理。2.创建和管理链接4 4）脚本链接）脚本链接指执行指执行javascriptjavas

10、cript代码或调用代码或调用javascriptjavascript函数函数.如在链接地址键入如在链接地址键入:javascript:alert(“meiyoujavascript:alert(“meiyou”)”)5 5）E Emailmail链接链接通过插入栏插入电子邮件链接通过插入栏插入电子邮件链接也可以用属性面板创建电子邮件链接，直接也可以用属性面板创建电子邮件链接，直接 键键 入：入：“mailtomailto：邮箱地址：邮箱地址”3.创建跳转菜单跳转菜单是一个选项弹出菜单。这些选项可包跳转菜单是一个选项弹出菜单。这些选项可包括其它文件、电子邮件、图片或其它任何可在括其它文件、电子

11、邮件、图片或其它任何可在浏览器中打开的链接。跳转菜单包含一个菜单浏览器中打开的链接。跳转菜单包含一个菜单选择提示（可选）、一个链接菜单列表和一个选择提示（可选）、一个链接菜单列表和一个“前往前往”按钮（可选按钮（可选）。）。3.创建跳转菜单（1 1）插入跳转菜单）插入跳转菜单“插入栏表单跳转菜单插入栏表单跳转菜单”使用跳转菜单时，会发现第一选项其实没起到使用跳转菜单时，会发现第一选项其实没起到作用，无法选定该选项，解决方法：作用，无法选定该选项，解决方法：使用菜单提示，每次选择菜单后，自动选择使用菜单提示，每次选择菜单后，自动选择 菜单提示。例如可以将第一项设为菜单提示。例如可以将第一项设为“

12、请选择请选择”文字文字使用使用“前往前往”按钮按钮 3.创建跳转菜单（2 2）编辑跳转菜单编辑跳转菜单使用属性面板和使用属性面板和“行为行为”面板：面板：属性面板列表值属性面板列表值“窗口行为窗口行为”打开打开“行为行为”面板，双击面板，双击“跳转菜跳转菜 单单”选项，可以跳转菜单进行编辑选项，可以跳转菜单进行编辑 4.创建导航条导航条由一个或多个图像组成，其显示根据用导航条由一个或多个图像组成，其显示根据用户的动作而改变。因此，在使用导航条命令之户的动作而改变。因此，在使用导航条命令之前，应首先创建一个导航条图像集。这些图像前，应首先创建一个导航条图像集。这些图像代表四种状态。代表四种状态。一般一般 滑过滑过 按下按下 按下时鼠标经过按下时鼠标经过 5.创建图像地图