Web设计小组

Web创作常见问题解答:超链接


英语-荷兰语-法国
目录-完整FAQ(HTML)-整个常见问题解答(文本)
上一节-下一节

本文档回答了网络作者经常提出的问题。虽然它的重点是HTML相关的问题,但此FAQ也回答了一些与CSS、HTTP、JavaScript、服务器配置等相关的问题。

本文件由Darin McGrew保管<darin@htmlhelp.com>并定期发布到新闻组comp.infosystems.www.authoring.html.它最后一次更新是在2007年4月26日。

第6节:超链接

  1. 如何创建链接?
  2. 如何链接到HTML文档中间的位置?
  3. 如何创建打开新窗口的链接?
  4. 如何创建链接以打开特定大小的新窗口?
  5. 如何让人们从我的页面下载文件?
  6. 如何强制浏览器下载文件?如何强制浏览器显示/播放文件本身?如何强制特定程序打开文件?
  7. 如何创建一个像链接一样的按钮?
  8. 如何在页面上创建后退按钮?
  9. 如何创建一个按钮来自动为我的网站添加书签?
  10. 如何创建打印页面的按钮?
  11. 我怎么能做一个关窗户的按钮?
  12. 如何创建发送电子邮件的链接?
  13. 如何为mailto链接指定主题?
  14. 如何关闭链接上的下划线?
  15. 我怎么能有两组不同颜色的链接?
  16. 当光标位于链接上时,如何更改链接?
  17. 为什么我的超链接全部出错或没有加载?
  18. 为什么我的链接在一个浏览器中有效,但在另一个浏览器却无效?
  19. 为什么我链接到。。。文件下载了一堆字符?

以下问题已移至常见问题解答的其他部分。

6.1. 如何创建链接?

使用锚元素。这个HREF公司属性指定的URL要链接到的文档。以下示例将文本“Web Authoring FAQ”链接到<网址:http://www.htmlhelp.com/faq/html/>:

<A HREF=“http://www.htmlhelp.com/faq/html/“>Web创作常见问题解答

另请参阅

6.2. 如何链接到HTML文档中间的位置?

首先,标记链接的目标。标记链接目的地的旧方法是使用锚使用NAME属性。例如:
<h2>第2节:超越简介</a></h2>

标记链接目的地的现代方法是使用ID属性。例如:
第2节:超越简介</h2>

第二,链接到标记的目的地。URL是文档的URL,带有“#”和NAME的值或附加ID属性。继续上述示例,您可以在同一文档的其他地方使用:
转到第2节</a>

类似地,在另一个文档中,您可以使用:
转到我的论文</a>

6.3. 如何创建打开新窗口的链接?

<a target=“_blank”href=…>打开一个新的未命名窗口。

<a target=“example”href=…>打开一个名为“示例”,前提是使用该名称的窗口或框架尚未存在。

注意,TARGET属性不是HTML4 Strict的一部分。在HTML4 Strict中,只能使用JavaScript创建新窗口。(见下一个问答)此外,如果出现以下情况,打开新窗口的链接可能会让读者感到厌烦(从读者的角度来看)他们没有一个好的理由。

6.4. 如何创建链接以打开特定大小的新窗口?

使用HTML,无法控制大小(或窗口装饰,或其他功能)。然而,在JavaScript中,当使用window.open()窗口功能。

从一个普通的HTML链接开始(可能是在新窗口中打开的链接如中所述前一个问题的答案).然后使用ONCLICK属性打开具有所需外观的窗口适用于支持和启用JavaScript的读者。以下示例指定了一个名为“popup”的窗口,即300像素x 150像素。

<a href=“example.html”target=“popup”onclick=“window.open('example.html','popup','width=300,height=150');return false“>查看Foo</a>

以这种方式使用,JavaScript可以使用所需外观,当JavaScript不支持/已禁用。

除了参数之外高度宽度(以像素计数为值),第三个参数window.open()窗口可以包括以下内容booloean参数(取“是”“没有”作为a值):目录、位置、菜单栏、可调整大小、滚动条、状态和工具栏。这些布尔参数控制相应窗口的存在结果窗口中的装饰。

另请参阅

6.5. 如何让人们从我的页面下载文件?

文件上传到服务器后,只需使用锚引用标记以链接到它。例如:

立即下载foo!(100kb邮政编码)</a>

服务器可能需要配置一些不同的文件类型。(请参阅下一个问答。)

另请参阅

6.6. 怎么 我会强制浏览器下载文件吗?如何强制浏览器显示/播放文件本身?如何强制特定程序打开文件?

你不能可靠地做这些事情,因为网络不工作那样。

当浏览器请求文档(超文本、图像、音频、,多媒体等),服务器告诉浏览器它是什么类型的文件。服务器应配置为标识文档的媒体类型正确地。

然后浏览器决定如何处理它。不同的浏览器能够并配置为显示不同的文档本身的类型。浏览器通常配置为使用以下命令处理其他文件类型适当的助手应用程序或提供将文档保存到文件系统。

RFC 2183描述了可以使用的Content-disposition标头建议浏览器如何处理文档。值“inline”建议显示文档自动,并且值“attachment”表明用户应该在显示(或保存)文档之前进行提示。请注意,此机制具有重要的安全影响,包括如RFC中所述。

大多数浏览器允许用户下载到磁盘,如果他们愿意的话。如果文件必须保存到磁盘绝对没有其他方法为了处理它,MIME类型可以是“应用程序/octet-stream”。然而,这本质上说,“我不能或不会告诉你这是什么。”此外,MIME类型“application/octet-stream”引发错误MSIE的HTTP实现中的行为。更好的替代方法是自定义MIME类型,如“application/x-some-explanation”,避免了这些问题。

另请参阅

6.7. 如何创建一个像链接一样的按钮?

最好使用一个小表格:

<表单操作=“[网址]“方法=获取>
<INPUT TYPE=submit VALUE=“按钮上的文本”>
</FORM>

如果你想把按钮排成一行,你必须把它们放在一个单行表中,每个按钮都在一个单独的单元格中。

请注意,搜索引擎可能找不到目标文档,除非页面上其他地方有一个正常的链接。

go-to-other-page按钮也可以用JavaScript编码,但以上是标准HTML,适用于更多读者。

6.8. 如何在页面上创建后退按钮?

您无法使用HTML执行此操作。“返回”意味着返回历史记录中的前一个位置。您可以创建指向HTTP Referer头中指定的URL的链接(在CGI程序的HTTP_REFERER环境变量中可用),但创建链接的向前地到你历史上的一个新位置。即使如此,Referer标题中的信息也可能是错误的。当用户输入手动URL或使用书签。有些人从不发送Referer头(可选)。

您可以使用JavaScripthistory.back()创建背部按钮(或链接)。当然,这仅在支持和启用JavaScript时有效。

此外,值得注意的是,唯一使用的导航工具比“back”功能更常见的是超链接。你的读者几乎肯定知道如何使用浏览器的“back”功能。不知道如何使用浏览器基本功能的用户只会当不同的页面以不同的方式模拟这些功能时,请感到困惑。

另请参阅

6.9. 如何创建一个自动为我的站点添加书签的按钮?

你不能用HTML做这件事。然而,Internet Explorer 4+支持窗口。外部。添加收藏夹()方法,一个专有扩展到JavaScript,打开“添加到收藏夹”对话框。下面的示例避免为那些使用其他浏览器或禁用JavaScript的浏览器:

<script type=“text/javascript”>函数addf(){窗口。外部。添加收藏夹('http://www.htmlhelp.com/',“Web设计组”);}如果(window.external&&窗口类型。外部。添加收藏夹!='未定义'){document.write('<input type=“button”'+'onclick=“addf()”value=“书签WDG”>');}</script>

值得注意的是,知道如何使用书签的读者几乎当然知道如何独立地为您的站点添加书签。同样,少数不知道如何为你的网站添加书签的读者可能不知道如何使用您为其创建的书签。不知道如何使用浏览器基本功能的用户只会当不同的页面以不同的方式模拟这些功能时,请感到困惑。

6.10. 如何创建打印页面的按钮?

你不能用HTML做这件事。然而,一些浏览器支持JavaScriptwindow.print()方法,该方法打开“打印”对话框。下面的示例避免为那些使用其他浏览器或禁用JavaScript的浏览器:

<script type=“text/javascript”>if(窗口打印){document.write('<input type=“button”onclick=“window.print()”'+'value=“Print This Page”>');}</script>

值得注意的是,拥有打印机的读者几乎可以肯定知道如何使用浏览器的打印功能。不知道如何使用浏览器基本功能的用户只会当不同的页面以不同的方式模拟这些功能时,请感到困惑。

另请参阅

6.11. 我怎么能做一个关窗户的按钮?

你不能用HTML做这件事。然而,JavaScript方法window.close()将关闭一个窗口。下面的示例避免为那些禁用JavaScript时:

<script type=“text/javascript”>if(自关闭){document.write('<input type=“button”onclick=“self.close()”'+'value=“Close This Window”>');}</script>

值得注意的是,你的读者可能对他们的系统关闭窗口的标准机制。不知道如何使用浏览器基本功能的用户只能当不同的页面以不同的方式模拟这些功能时,请感到困惑。

6.12. 如何创建发送电子邮件的链接?

例如,使用mailto链接

向我发送电子邮件
<A HREF=“邮寄至:me@mydomain.com">me@mydomain.com</A>。

请注意,您在WWW上发布的任何电子邮件地址都将可能开始收到未经请求的商业电子邮件(UCE,垃圾邮件)。保护您的真实电子邮件地址是一个好主意(例如,通过过滤传入电子邮件,或仅对mailto链接使用单独的地址)。

6.13. 如何为mailto链接指定主题?

你不可能,没有任何可靠的方式。经常发布的方法并非对所有人都有效浏览器和电子邮件软件的组合(甚至不常见组合),其中许多都有一个重要的缺点:当它们失败时,电子邮件将丢失。

如果你真的需要一个主题,你可以通过在您的页面,它将数据提交给通过电子邮件发送表单的CGI程序用您想要的主题行向您发送数据。然而,表格必须有访客电子邮件地址的输入字段,您一定希望访客正确进入。

以下是传输主题类型信息的一些其他方法:

另请参阅

6.14. 如何关闭链接上的下划线?

如果您想在查看页面时关闭链接下划线在浏览器中,检查浏览器的配置选项。例如,在Mozilla Firefox中,请参阅工具>选项…>字体和颜色。。。对于“下划线链接”选项,在Opera中参见工具>首选项…>Web页对于“为普通链接加下划线”和“为访问的链接加下线”选项,在MSIE 6中,请参见工具>Internet选项>高级>浏览用于“下划线链接”选项。

如果您想防止页面上的链接在您的访问者看到了它们,HTML无法实现这一点。您可以通过定义

a: 链接,a:visited,a:active{text-decoration:none}

6.15. 我怎么能有两组不同颜色的链接?

您可以在样式表中建议此演示文稿。首先,为普通链接指定颜色,如下所示:

a: 链接{颜色:蓝色;背景:白色}a: 访问过{颜色:紫色;背景:白色}a: 活动{颜色:红色;背景:白色}

接下来,确定要使用不同颜色的链接。您可以使用类别属性HTML,如下所示:

<a class=“example1”href=“[网址]">[链接文本]</a>

然后,在样式表中,为链接使用选择器类别属性,如下所示:

示例1:链接{颜色:黄色;背景:黑色}示例1:已访问{颜色:白色;背景:黑色}示例1:活动{颜色:红色;背景:黑色}

或者,您可以标识包含链接的元素你想要不同的颜色,像这样:

<div class=“example2”>...
<a href=“[网址]">[链接文本]</a>...
<a href=“[网址]">[链接文本]</a>...
<a href=“[网址]">[链接文本]</a>...
</div>

然后,在样式表中,为以下链接使用选择器包含元素,如下所示:

.example2 a:链接{颜色:黄色;背景:黑色}.example2 a:已访问{color:white;background:black}.example2 a:活动{颜色:红色;背景:黑色}

另请参阅

6.16. 当光标位于链接上时,如何更改链接?

在样式表中,使用悬停要指定的伪类当光标位于链接上时,链接的外观不同。指定悬停后的伪类链接已访问伪类。例如:

A: 链接{颜色:蓝色;背景:白色}
A: 访问过{颜色:紫色;背景:白色}
A: 悬停{颜色:红色;背景:白色}

另请参阅

6.17. 为什么我的超链接全部出错或没有加载?

您的标记可能包含影响链接的HTML语法错误。例如,周围可能没有引号属性值需要报价的,或者可能缺少右引号结束HREF公司属性值。

完全有效的标记可能会触发常见的浏览器错误。例如,即使“>”字符在内部有效(带引号)属性值,一些较旧的浏览器会认为标记到此为止,所以标记的其余属性显示为普通文本。同样,注释中的“>”字符可以触发类似的浏览器漏洞。

另一个例子是,Netscape Navigator的旧版本有问题指向命名锚点的链接当锚位于使用排列属性。

您的URL也可能不正确。例如,您的web创作软件可能使用了文件URL(例如。,文件:C:\path\file.html).如果是,则应将其替换为相对URL(例如。,文件.html)或http URL(例如。,http://example.com/path/file.html).

HTML验证器会在标记中发现语法错误。HTML检查器/linter可以找到一些语法错误和有效的标记已知会触发一些常见的浏览器错误。链接检查器可以找到指向不正确URL的链接。

另请参阅

6.18. 为什么? 我的链接在一个浏览器中有效吗?

有空格吗,#?,或路径中的其他特殊字符或文件名?URL中的空格是非法的。如果您通过将其替换为%20来对空间进行编码,则链接将起作用。

您可以将URL中的任何字符编码为%加上两位十六进制字符的值。(十六进制数字A-F可以是大写或小写。)根据规范,只有字母数字和特殊字符-_.!*'()永远不需要编码。

当其他字符出现在URL中时,您应该对其进行编码,除非它们用于其保留用途。例如,如果您想将值“Jack&Jill”传递给CGI脚本中,您需要将“&”字符编码为“%26”可能会为您提供如下URL:http://www.foo.com/foo.cgi?rhym=Jack%26Jill&audience=child

请注意,此URL中的“?”和其他“&”字符不是编码,因为它们用于其保留用途。但是,当此URL用作HTML中的属性值时文档中,“&”字符必须编码为“&amp;”,如以下内容:<a href=“http://www.foo.com/foo.cgi?rhym=Jack%26Jill&amp;观众=孩子“>

另请参阅

6.19。 为什么我链接到。。。文件下载了一堆字符?

如果您试图链接到特定类型的文件,但它不是返回所需的响应,很可能服务器需要已配置类型。与系统管理员讨论让他们添加内容类型。以下是可能需要配置的常见类型列表:

内容类型 描述
应用程序/msword Microsoft Word文档
应用程序/八位字节流 未分类的二进制数据(通常用于压缩文件或可执行文件)
应用程序/pdf PDF文档
应用程序/vnd.ms-excel Microsoft Excel电子表格
应用程序/zip ZIP存档
音频/x-wav WAV音频格式
音频/midi MIDI音频格式
音频/x-pn-realaudio RealAudio(真实音频)
图像/gif GIF图像格式
图像/jpeg JPEG图像格式
图像/png PNG图像格式
文本/css CSS样式表
文本/html HTML文档
文本/纯文本 纯文本
视频/mpeg MPEG视频格式
视频/快速时间 QuickTime视频格式
视频/x-msvideo AVI视频格式

确保文件正确发送到客户端将其压缩为标准压缩格式。实际上,所有服务器都设置为处理.zip扩展名得到用户的广泛认可。

一些服务器(NCSA、Apache和其他)可以配置为支持用户配置的内容类型。详细信息取决于服务器,因此请咨询服务器管理员或文档。

请注意,Internet Explorer错误地忽略了服务器提供的MIME类型,所以当服务器配置错误。其他浏览器正确地注意到服务器提供的MIME类型,因此它们将揭示服务器配置错误。

另请参阅

目录-完整FAQ(HTML)-整个常见问题解答(文本)
上一节-下一节