DreamWeaver-cs6学习笔记第10课处理导航

第10课 处理导航

1、超链接基础知识：①超链接（或链接）是对Internet 上或者你自己的计算机内的可用资源的引用。超链接创建通过HTML 或者你使用的程序设计语言指定的交互式行为，并通过浏览器或者其他应用程序启用。HTML 超链接由锚记元素及一个或多个属性组成如图示： ②内部超链接是把用

户带到相同文档、相同文件夹或硬盘驱动

器中存储的另一个文

档的超链接，而外部超链接是把用户带到

硬盘驱动器、Web 站点或Web 主机外面的文档资源。都是通过锚记元素嵌入在HTML 中，这个元素指定超链接的目的地的地址或目标，并且可以使用几个属性指定它的工作方式。

③相对超链接就是引用相对于当前文档存储的目标，往往包括资源名称，也许还包括存储它的文件夹比如logo.jpg 或

images/logo.jpg 。绝对超链接引用绝对路径的资源，常用于引用站点外面的资源，包括目标完整URL ，如

/index.jspa ，它可以把用户指引到特定的文件或者只是站点内的某个文件夹。相对链接书写起来更快、更容易，但是如果文档保存在Web 站点中的不同文件夹中或者不同位置，它们可能不会工作。绝对链接则没有此限制，但文档或文件夹或重命名时则会失败。那么，为站点内的资源使用相对链接，为站点外的资源使用绝对链接。

2、创建内部超链接：①在“链接”框中输入文档名进行链接：打开文档，选取要添加链接的文本如Home （如是从模板创建的文档，此文本不是可编辑区域而不能选取，则需要打开模板选取要添加链接的文本如Home 进行设置后更新）或图像，在“属性”检查器中选择HTML 选项卡的“链接”框中显示了一个超链接符“#”，将此符号换成“../index.html ”回车则可。但是还没有主页；②在“链接”框后浏览窗中选择文档名进行链接：打开文档，选取要添加链接的文本如Home （如是从模板创建的文档，此文本不是可编辑区域而不能选取，则需要打开模板选取要添加链接的文本如Home 进行设置后更新）或图像，在“属性”检查器中选择HTML 选项卡的“链接”框中显示了一个超链接符“#”，点此框后的“浏览文件图标”，从站点根文件夹中选择文件，确保“相对于”框中设置为“文档”，确定则可，则“#”变成文件名了。③拖动“链接”框后的指向文件到要链接的文件进行链接：选择要链接的文本（可以从一个字符到整个段落）或图像，打开文件面板，找到要链接的文件，将“属性”检查器中“HTML ”项的指向文件符拖到要链接的文件处则可。如何要链接的文件还包含在某个文件夹中，则可把“指向文件”图标拖到该文件夹上并且按住它，还可上下移到找到该文件。④注意：如果是编辑模板则会弹出更新窗，？但是我的会重复弹出更新窗？；？链接的文件要在站点的根目录下才行？。通常，利用超链接格式化的图像将显示蓝色边框，类似于加蓝色下划线的文本链接。但是布局中带有的预先定义的CSS 包括一个a img 规则，它把这个默认的边框设置为“无”。如果在浏览时单击链接要弹出新的页面而不是新页面替换原来页面，则要在在“属性”检查器中“HTML ”项的“目标”框中输入_blank

3、创建外部链接：选取要创建链接的文本或图像，在“属性”检查器中“HTML ”项的“链接”框中输入文件的路径及名或者是URL （可从浏览器中搜索复制而来）。

4、建立电子邮件链接：①电子邮件链接不是把你带到另一个页面，而是打开访问者的电子邮件程序。它可以为访问者创建自动的、预先编写好地址的电子邮件消息，用于接收客户反馈、产品订单或者其他重要的通信。电子邮件链接的代码稍微不同于正常的超链接，DW 可以为你自动创建正确的代码。②选取要创建链接的文本（不能是图像），点菜单“插入－电子邮件链接”（也可是“插入”面板的“常用”功能中点）弹出“电子邮件链接”窗，在“文本”框中自动出现选择的文本，

在“电子邮件”框中输入电子邮件地址（如412385328@）后点确定则可，保存后在浏览器中预览测试，弹出窗口警告：因为默认邮件客户端没有正确安装，所以无法执行该操作。③基于客户的功能与服务器端功能：

5、把页面元素作为目标：⑪命名锚记：①命名锚记的了解：●这种可叫内部目标链接，它含有两部分是链接本身和目标元素，随便先创建哪个部分都可以，可以在想创建链接的任何地方使用命名锚记。●输入或选取要链接的文本如Return to Top（或标签选择器），在“链接”框中输入“#top”，通过使用#top，就创建了指向当前页面内的目标的链接。但这个目标还不存在，DW把目标元素称为命名锚记（提示：在官官相护浏览器中，只需要输入#以启用该功能。无论何时引用未命名锚记，浏览器都将跳转到页面顶部。但有些浏览器将完全忽略它们。因此使用目标元素也很重要）。●把光标定位在标题元素上，把命名锚记置于页面顶部很重要，否则当浏览器跳转到目标时页面的一部分可能会变得模糊不清，在这种情况下，最佳的解决方案是给模板添加命名锚记，那么无论你想在哪里添加一个返回页面顶部的链接，都能够在整个站点内使用够不够锚记。②创建命名锚记：打开模板文档，在中插入光标（鼠标在该区域单击则可），点菜单“插入－命名锚记”（也可从“插入”面板的“常用”中点“命名锚记”），在弹出的“命名锚记”窗中“锚记名称”框中输入top确定出现锚记图标（其代码为：），保存更新则可。③警告：相关的锚记代码应该不会对任何文本内容或页面布局产生任何影响。不过，在藉此类型的结构中，人们知道会发生一些奇怪的事情，如果你的页面布局由于在一个位置插入锚记代码而受到不行的影响，就尝试在另的位置插入它，也可将原来设置好的Return to Top复制过来则可（因为连同链接也一起复制）。

⑫使用ID属性：①如果要转到的地方附近有一个方便的元素可以给它添加

ID属性，就不需要添加额外的代码。②打开文档，在要创建ID元素的位置

插入光标，并选取其标签选择器。③打开“属性”检查器的“HTML”项中

“ID”框的下拉菜单如图示，没有可于表格的ID，将光标插入此框后输入ID名称，在标签选择器栏选定的标签则变为其后带有“#”和ID名（如）。④注意：可以把ID应用于任何HTML元素，在样式表中根本不必引用它们；在创建ID时，记住它们必须是唯一。

6、插入Spry菜单栏：⑪、了解Spry菜单栏：①完成的页面中的菜单允许直接导航到站

点中的特定内容，这些链接被显示为垂直菜单中的子菜单。尽管当前的菜单没有这种功能，如果你熟悉JavaScript和CSS，也可以自己把它添加到现有代码中。但是当DW在预先构建的构件中提供