HTML配合实例手把手教之HTML链接.doc

HTML 使用超级链接与网络上的另一个文档相连。几乎可以在所有的网页中找到链接。点击链接可以从一张页面跳转到另一张页面。实例创建超级链接 本例演示如何在 HTML 文档中创建链接。本文本 是一个指向本网站中的一个页面的链接。本文本 是一个指向万维网上的页面的链接。本文本 是一个指向本网站中的一个页面的链接。本文本 是一个指向万维网上的页面的链接。将图像作为链接 本例演示如何使用图像作为链接。您也可以使用图像来作链接：您也可以使用图像来作链接： HTML 超链接（链接）超链接可以是一个字，一个词，或者一组词，也可以是一幅图像，您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。当您把鼠标指针移动到网页中的某个链接上时，箭头会变为一只小手。我们通过使用 标签在 HTML 中创建链接。有两种使用 标签的方式：1. 通过使用 href 属性 - 创建指向另一个文档的链接 2. 通过使用 name 属性 - 创建文档内的书签 HTML 链接语法链接的 HTML 代码很简单。它类似这样：Link texthref 属性规定链接的目标。开始标签和结束标签之间的文字被作为超级链接来显示。实例Visit W3School上面这行代码显示为：Visit W3School点击这个超链接会把用户带到 W3School 的首页。提示：链接文本 不必一定是文本。图片或其他 HTML 元素都可以成为链接。HTML 链接 - target 属性使用 Target 属性，你可以定义被链接的文档在何处显示。下面的这行会在新窗口打开文档：Visit W3School!Visit W3School!如果把链接的 target 属性设置为 _blank，该链接会在新窗口中打开。Visit W3School! 如果把链接的 target 属性设置为 _blank，该链接会在新窗口中打开。HTML 链接 - name 属性name 属性规定锚（anchor）的名称。name 属性用于创建 HTML 内部的书签。书签不会以任何特殊方式显示，它对读者是不可见的。当使用命名锚（named anchors）时，我们可以创建直接跳至页面中某个节的链接，这样使用者就无需不停的滚动页面来寻找他们需要的信息。命名锚的语法：Text to be displayed提示：锚的名称可以是任何你喜欢的名字。实例HTML 文档内部的已命名的锚：Useful Tips Section然后，我们创建指向相同文档中“有用的提示”部分的链接：Visit the Useful Tips Section或者，创建从另一个页面指向该文档中“有用的提示”部分的链接：Visit the Useful Tips Section在上面的代码中，我们将 # 符号和锚名称添加到 URL 的末端，就可以直接链接到 tips 这个命名锚了。具体效果：有用的提示 基本的注意事项 - 有用的提示：注释：请始终将正斜杠添加到子文件夹。假如这样书写链接：href=/html，就会向服务器产生两次 HTTP 请求。这是因为服务器会添加正斜杠到这个地址，然后创建一个新的请求，就像这样：href=/html/。提示：命名锚经常用于在大型文档开始位置上创建目录。可以为每个章节赋予一个命名锚，然后把链接到这些锚的链接放到文档的上部。如果您经常访问百度百科，您会发现其中几乎每个词条都采用这样的导航方式。提示：假如浏览器找不到已定义的命名锚，那么就会定位到文档的顶端。不会有错误发生。更多实例在新的浏览器窗口打开链接 本例演示如何在新窗口打开一个页面，这样的话访问者就无需离开你的站点了。Visit W3School!如果把链接的 target 属性设置为 _blank，该链接会在新窗口中打开。Visit W3School! 如果把链接的 target 属性设置为 _blank，该链接会在新窗口中打开。链接到同一个页面的不同位置 本例演示如何使用链接跳转至文档的另一个部分 查看 Chapter 4。Chapter 1This chapter explains ba bla blaChapter 2This chapter explains ba bla blaChapter 3This chapter explains ba bla blaChapter 4This chapter explains ba bla blaChapter 5查看 Chapter 4。 Chapter 1This chapter explains ba bla blaChapter 2This chapter explains ba bla blaChapter 3This chapter explains ba bla blaChapter 4This chapter explains ba bla blaChapter 5跳出框架 本例演示如何跳出框架，假如你的页面被固定在框架之内。被锁在框架中了吗？ 请点击这里！ 被锁在框架中了吗？请点击这里！创建电子邮件链接 本例演示如何如何链接到一个邮件。（本例在安装邮件客户端程序后才能工作。）这是邮件链接：发送邮件注意：应该使用 %20 来替换单词之间的空格，这样浏览器就可以正确地显示文本了。这是邮件链接： 发送邮件 注意：应该使用 %20 来替换单词之间的空格，这样浏览器就可以正确地显示文本了。 创建电子邮件链接 2 本例演示更加复杂的邮件链接。 这是另一个 mailto 链接：发送邮件！注意：应该使用 %20 来替换单词之间的空格，这样浏览器就可以正确地显示文本了。这是另一个 mailto 链接： 发送邮件！ 注意：应该使用 %20 来替换单词之间的空格，这样浏览器就可以正确地显示文本了。 点击发送邮件，出现一个对话框HTML 链接标签标签描述定义锚。HTML 标签定义和用法 标签可定义锚。锚 (anchor) 有两种用法： 通过使用 href 属性，创建指向另外一个文档的链接（或超链接） 通过使用 name 或 id 属性，创建一个文档内部的书签（也就是说，可以创建指向文档片段的链接） 元素最重要的属性是 href 属性，它指定链接的目标。在所有浏览器中，链接的默认外观是： 未被访问的链接带有下划线而且是蓝色的 已被访问的链接带有下划线而且是紫色的 活动链接带有下划线而且是红色的 提示：您可能已经注意到了，W3School 站点内的链接外观与默认的链接外观非常不同。您可以使用 CSS 伪类 向文本超链接添加复杂而多样的样式。实例指向 w3school 的超链接：W3School可选的属性DTD 指示此属性允许在哪种 DTD 中使用。S=Strict, T=Transitional, F=Frameset.属性值描述DTDcharset字符集名称规定目标 URL 的字符编码。STFcoords坐标规定链接的坐标。STFhrefURL链接的目标 URL。STFhreflangISO 语言代码规定目标 URL 的基准语言。STFnamesection_name规定锚的名称。STFreltext规定当前文档与目标 URL 之间的关系。STFrevtext规定目标 URL 与当前文档之间的关系。STFshape default rect circle poly 规定链接的形状。STFtarget _blank _parent _self _top framename