超级链接

超级链接是网址中应用较为经常的HTML原素,由于网址的各种各样网页页面全是由超级链接串连而成 ,超级链接完成了网页页面中间的自动跳转 。超级链接是浏览者和网络服务器的互动的关键方式 ,在后面的技术性中会逐渐推进学习 。

—  留意:图片还可以做连接,将在下一章“网页页面中的图片”详尽学习。

 4.5.1  给文本加上连接

超级链接的标识是<a></a>,给文本加上超级链接类似别的装饰标识。加上了连接后的文本有其独特的款式 ,以和别的文本区别,默认设置连接款式为深蓝色文本,有下横线 。超级链接是自动跳转到另一个网页页面的 ,<a></a>标识有一个href特性承担特定html页面的详细地址。href特定的详细地址一般应用相对性详细地址。

—  表明:网站建设中,文本文档相对性详细地址应用更加广泛 。

在D:\web\文件目录下建立网页源代码,取名为a.htm ,撰写编码如编码4.18所显示。

编码4.18  超级链接的设定:a.htm

<html>

<head>

  <title>超级链接的设定</title>

</head>

<body>

<font size="5">

<a href="ul_ol.htm">进到目录的设定网页页面</a>

</font>

</body>

</html>

电脑浏览器地址栏键入http://localhost/a.htm,访问实际效果如图16.19所显示。

HTML 超级链接详细讲解 超链接 HTML HTML/Xhtml  第1张

图16.19  超级链接的设定

阅读者可从图16.19中见到超级链接的默认设置款式,当点击网页页面中的连接 ,网页页面将自动跳转到同一文件目录下的ul_ol.htm网页页面,即以前的目录设定网页页面 。当点击电脑浏览器的“倒退 ”按键,返回a.htm网页页面时 ,文本连接的色调变成了蓝紫色 ,用以告知浏览者,此链接早已被浏览过。

 4.5.2  改动连接的对话框打开

默认设置状况下,超级链接开启html页面的方法是自身遮盖。依据浏览者的不一样必须 ,阅读者能够特定超级链接的别的开启新页面的方法 。超级链接标识出示了target特性开展设定,赋值各自为_self(自身遮盖,默认设置)、_blank(建立新页面开启html页面) 、_top(在电脑浏览器的全部对话框开启 ,可能忽视全部的框架剪力墙) 、_parent(在上一级对话框开启)。

—  留意:_top和_parent方法用以架构网页页面,后边章节目录有详细说明。

 4.5.3  给连接加上提醒文本

许多 状况下,超级链接的文本不能叙述所要连接的內容 ,超级链接标识出示了title属特性很便捷地给浏览者作出提醒 。title特性的值即是提醒內容,当浏览者的鼠标光标滞留在超级链接处时,提醒內容才会出現 ,那样不容易危害网页页面排版设计的干净整洁 。改动a.htm网页源代码,撰写编码如编码4.19所显示。

编码4.19  超级链接的设定:a.htm

<html>

<head>

  <title>超级链接的设定</title>

</head>

<body>

<font size="5">

<a href="ul_ol.htm" target="_blank" title="阅读者您好,如今你见到的是提醒文本 ,点击本连接能够新开窗口自动跳转到ul_ol.htm网页页面。">进到目录的设定网页页面</a>

</font>

</body>

</html>

在电脑浏览器地址栏键入http://localhost/a.htm ,访问实际效果如图16.20所显示 。

HTML 超级链接详细讲解 超链接 HTML HTML/Xhtml  第2张

图16.20  超级链接的提醒文本

 4.5.4  什么叫锚(anchor)

许多 网页页面文章内容的內容比较多,造成 网页页面较长,浏览者必须不断拖拽电脑浏览器的网页滚动条才可以寻找必须的內容。超级链接的锚作用能够处理这个问题 ,锚(anchor)是取自于船舶上的锚,锚被扔下后,船舶就不易飘走、迷了路。事实上锚便是用以在单独网页页面内不一样部位的自动跳转 ,有的地区称为便签 。

超级链接标识的name特性用以界定锚的名字,一个网页页面能够界定好几个锚,根据超级链接的href特性能够依据name自动跳转到相匹配的锚。在D:\web\文件目录下建立网页源代码 ,取名为a_anchor.htm,撰写编码如编码4.20所显示。

编码4.20  超级链接的锚:a_anchor.htm

<html>

<head>

  <title>超级链接的设定</title>

</head>

<body>

<font size="5">

<a name="top">这儿是顶端的锚</a><br />

<a href="#1">第一任</a><br />

<a href="#2">第二任</a><br />

<a href="#3">第三任</a><br />

<a href="#4">第4任</a><br />

<a href="#5">第5任</a><br />

<a href="#6">第六任</a><br />

<h2>英国列任美国总统</h2>

●第一任(1789-1797)<a name="1">这儿是第一任的锚</a><br />

名字:乔冶·美国华盛顿<br />

George Washington<br />

生卒:1732-1799<br />

执政党::联邦政府<br />

●第二任(1797-1801)<a name="2">这儿是第二任的锚</a><br />

名字:罗伯特·拉塞尔<br />

John Adams<br />

生卒:1735-1826<br />

执政党::联邦政府<br />

●第三任(1801-1809)<a name="3">这儿是第三任的锚</a><br />

名字:托马斯火车·杰斐逊<br />

Thomas Jefferson<br />

生卒:1743-1826<br />

执政党::民共<br />

●第4任(1809-1817)<a name="4">这儿是第4任的锚</a><br />

名字:勒布朗詹姆斯·巴特里<br />

James Madison<br />

生卒:1751-1836<br />

执政党:民共<br />

●第5任(1817-1825)<a name="5">这儿是第5任的锚</a><br />

名字:勒布朗詹姆斯·莱特币<br />

James Monroe<br />

生卒:1758-1831<br />

执政党:民共<br />

</font>

</body>

</html>l>

在检测以前,阅读者从编码4.20能够见到 ,界定锚也是用的<a></a>标识,锚的名字用name特性界定(名字沒有限定,可自定) 。而找寻锚的连接用href特性特定相匹配的名字 ,在名字前边得加个#标记。在电脑浏览器地址栏键入http://localhost/a_anchor.htm ,访问实际效果如图16.21所显示。

HTML 超级链接详细讲解 超链接 HTML HTML/Xhtml  第3张

图16.21  超级链接的锚

当浏览者点击超级链接时,网页页面将全自动翻转到href特性值名字的锚部位 。

—  留意:界定锚的标识<a name=""></a>内不一定必须主要内容,仅仅做一个精准定位。

 4.5.5  电子邮箱、FTP和Telnet的连接

超级链接还能够进一步拓展网页页面的作用 ,较为常见的有发电子邮箱 、FTP及其Telnet联接。进行之上的作用只必须改动超级链接的href值 。发电子邮箱的撰写文件格式为:

<a href = "mailto:邮箱地址">发来email</a>

邮箱地址务必详细,如intel@qq.com 。

前边提及过,网页浏览选用http协议书 ,而FTP网络服务器选用FTP协议联接,连接文件格式以下:

<a href = "ftp://网络服务器IP地址或网站域名">连接的文本</a>

FTP网络服务器连接和网站链接差别取决于常用协议书不一样。FTP必须从服务器管理人员处得到 登陆的管理权限。但是一部分FTP网络服务器能够密名浏览,进而能得到 一些公布的文档 。一样 ,联接Telnet协议书的网络服务器也是选用相近方式,文件格式以下:

<a href = "telnet://网络服务器IP地址或网站域名">连接的文本</a>

telnet协议书运用很少,应用http协议书占多数。在D:\web\文件目录下建立网页源代码 ,取名为mail.htm,撰写编码如编码4.21所显示。

编码4.21  超级链接的别的设定:mail.htm

<html>

<head>

  <title>超级链接的别的设定</title>

</head>

<body>

<font size="5">

<a href="mailto:intel@qq.com" title="阅读者您好,点击这儿能够发电子邮箱 。">发来E-mail</a><br />

<a href="ftp://101.22.25.11" title="阅读者您好 ,热烈欢迎进到FTP网络服务器。">联接FTP网络服务器</a><br />

<a href="telnet://101.22.25.11" title="阅读者您好 ,热烈欢迎进到Telnet网络服务器。">联接Telnet网络服务器</a>

</font>

</body>

</html>s

在电脑浏览器地址栏键入http://localhost/mail.htm,访问实际效果如图16.22所显示 。

HTML 超级链接详细讲解 超链接 HTML HTML/Xhtml  第4张

图16.22  超级链接的别的设定