HTML 链接

HTML 使用超级链接与网络上的另一个文档相连。

几乎可以在所有的网页中找到链接。点击链接可以从一张页面跳转到另一张页面。

实例

创建超级链接
本例演示如何在 HTML 文档中创建链接。
将图像作为链接
本例演示如何使用图像作为链接。

可以在本页底端找到更多实例

HTML 超链接(链接)

超链接可以是一个字,一个词,或者一组词,也可以是一幅图像,您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。

当您把鼠标指针移动到网页中的某个链接上时,箭头会变为一只小手。

我们通过使用 <a> 标签在 HTML 中创建链接。

有两种使用 <a> 标签的方式:

  1. 通过使用 href 属性 - 创建指向另一个文档的链接
  2. 通过使用 name 属性 - 创建文档内的书签

延伸阅读:什么是超文本?

HTML 链接语法

链接的 HTML 代码很简单。它类似这样:

<a href="url">Link text</a>

href 属性规定链接的目标。

开始标签和结束标签之间的文字被作为超级链接来显示。

实例

<a href="http://www.w3school.com.cn/">Visit W3School</a>

上面这行代码显示为:Visit W3School

点击这个超链接会把用户带到 W3School 的首页。

提示:"链接文本" 不必一定是文本。图片或其他 HTML 元素都可以成为链接。

HTML 链接 - target 属性

使用 Target 属性,你可以定义被链接的文档在何处显示。

下面的这行会在新窗口打开文档:

<a href="http://www.w3school.com.cn/" target="_blank">Visit W3School!</a>

亲自试一试

HTML 链接 - name 属性

name 属性规定锚(anchor)的名称。

您可以使用 name 属性创建 HTML 页面中的书签。

书签不会以任何特殊方式显示,它对读者是不可见的。

当使用命名锚(named anchors)时,我们可以创建直接跳至该命名锚(比如页面中某个小节)的链接,这样使用者就无需不停地滚动页面来寻找他们需要的信息了。

命名锚的语法:

<a name="label">锚(显示在页面上的文本)</a>

提示:锚的名称可以是任何你喜欢的名字。

提示:您可以使用 id 属性来替代 name 属性,命名锚同样有效。

实例

首先,我们在 HTML 文档中对锚进行命名(创建一个书签):

<a name="tips">基本的注意事项 - 有用的提示</a>

然后,我们在同一个文档中创建指向该锚的链接:

<a href="#tips">有用的提示</a>

您也可以在其他页面中创建指向该锚的链接:

<a href="http://www.w3school.com.cn/html/html_links.asp#tips">有用的提示</a>

在上面的代码中,我们将 # 符号和锚名称添加到 URL 的末端,就可以直接链接到 tips 这个命名锚了。

具体效果:有用的提示

基本的注意事项 - 有用的提示:

注释:请始终将正斜杠添加到子文件夹。假如这样书写链接:href="http://www.w3school.com.cn/html",就会向服务器产生两次 HTTP 请求。这是因为服务器会添加正斜杠到这个地址,然后创建一个新的请求,就像这样:href="http://www.w3school.com.cn/html/"。

提示:命名锚经常用于在大型文档开始位置上创建目录。可以为每个章节赋予一个命名锚,然后把链接到这些锚的链接放到文档的上部。如果您经常访问百度百科,您会发现其中几乎每个词条都采用这样的导航方式。

提示:假如浏览器找不到已定义的命名锚,那么就会定位到文档的顶端。不会有错误发生。

更多实例

在新的浏览器窗口打开链接
本例演示如何在新窗口打开一个页面,这样的话访问者就无需离开你的站点了。
链接到同一个页面的不同位置
本例演示如何使用链接跳转至文档的另一个部分
跳出框架
本例演示如何跳出框架,假如你的页面被固定在框架之内。
创建电子邮件链接
本例演示如何链接到一个邮件。(本例在安装邮件客户端程序后才能工作。)
创建电子邮件链接 2
本例演示更加复杂的邮件链接。

HTML 链接标签

标签 描述
<a> 定义锚。
时间: 2024-10-18 18:44:16

HTML 链接的相关文章

Sqlserver通过链接服务器访问Oracle的解决办法

转自http://blog.sina.com.cn/s/blog_614b6f210100t80r.html 一.创建sqlserver链接服务(sqlserver链接oracle)  首先sqlserver 链接oracle可以通过两个访问接口: “MSDAORA” 和“OraOLEDB.Oracle” 1.“MSDAORA”访问接口是由Microsoft OLE DB Provider for Oracle提供的,这里建议不使用此接口进行链接.通过该访问接口建立的链接服务器在进行查询orac

微信公众号中添加外部链接地址的图文教程

2017-9-18,长沙,有点闷,有点热. 本教程教大家如何在微信公众号中,添加外部的链接,网络有很多教程,但由于表述不太清楚,出个教程吧.最终实现在微信后台管理平台"原文链接"处插入外部链接,用户点击发布好的图文文章底部左下角的"阅读原文",就可以跳转到您添加的外部链接页面中去. 第1步. 使用微信公众管理帐号登陆微信管理后台 > 素材管理 > 图文消息 >  新建图文消息或者编辑文章都可以,如下图所示: 第2步. 之后,将页面向下拉,看到底部&

硬链接与软连接

写在前面 Linux系统中存在两种链接文件,硬链接(hard link)和符号链接(symbolic link).符号链接也称为软连接.想了解清楚这两种链接文件的区别并不容易,首先要清楚Linux文件系统的相关知识. 我们知道文件有文件名和数据.而Linux的文件系统在存储文件时分为两个部分,用户数据(userdata)和元数据(metadata).用户数据是文件的真实数据存储文件系统的data block中,元数据存储在一个iNode的节点块中,包括文件的iNode号,权限,大小,时间属性(a

firefox查看微信公众平台的数据分析时就出现不信任链接怎么办?

昨天用360清理垃圾后火狐主页的快速拨号栏消失了,整了半天还是无法使用就重装了一下firefox,导入备份的书签,添加自己所需的附加组件,设置为隐私模式,开始继续体验.按惯例打开微信公众平台,查看数据分析时出现火狐不信任链接提示,如下图1,"我已充分了解可能的风险"这个链接按钮被挡住了,无法点击,怎么办? 这个应该是火狐安全站点检测的原因,到"工具-选项-安全-例外-添加信任站点",输入公众平台的主域名, 添加好之后,保存,重启firefox,打开微信公众平台查看数

mysql链接错误:2003 can&#39;t connect to mysql server on 10038

出现这个错误原因是端口号不是3306. 打开D:\Program Files\MySQL\MySQL Server 5.5 \my.ini文件,当然还有其他的.ini的文件: [client] port=3306 [mysql] default-character-set=utf8 # SERVER SECTION# ----------------------------------------------------------------------## The following opt

thinkphp U方法生成链接没有host

今天将自己代码传到线上服务器,页面上用到很多thinkphp U() 方法生成的链接.本地测试没啥问题,到线上发现链接生成的不对,每个都没有了host 每个链接多个index,然后查看tp的U方法: $url    =   __APP__.'/'.($module?$module.MODULE_PATHINFO_DEPR:'').implode($depr,array_reverse($var)); 是因为__APP__这里的原因,然后找到__APP__赋值的地方: define('__APP_

unity3d 项目源码下载链接

2-1 炉石传说 客户端加服务器端 链接:http://pan.baidu.com/s/1dDKY3Fr 密码:c03q 2-2 新仙剑奇侠传 链接:http://pan.baidu.com/s/1b4QVqI 密码:dic5 2-3 unity3d 战斗卡牌<变身吧主公>客户端+服务器源码 链接:http://pan.baidu.com/s/1kUpot51 密码:i02u 2-4 降临OL-U3D全套源码 链接:http://pan.baidu.com/s/1sktLQ5v 密码:we0g

websocket链接数限制

无法解决 当我需要每跳转新打开一个页面链接一次websocket的时候,第六个开始loading,关掉前面的,会加载出来,查了查.... 由于websocket属于属于持久链接 不同的浏览器针对同一服务器的持久链接的数量限制如下: chrome  6 firefox  6 Safari 5 IE11以下 不支持 这种H5的新新技术不得不说有各种安全和兼容性问题,慎重选用

【转】Linux软连接和硬链接

再次温习一下,操作的不多.虽然感觉都会!!!! 这次再次操作一遍!! 通过上面的测试发现,删除f1之后,软连接f3就无效了,硬链接f3则不受影响. ls -F可以看到文件的类型. ---------------------------------------------------------------------------------------------------------------- 1.Linux链接概念Linux链接分两种,一种被称为硬链接(Hard Link),另一种被称

DEDECMS 修改广告链接地址

1.打开DEDECMS后台,选择"模块",选择"广告管理", 2.选择要修改的广告栏目,选择"更改", 在下图红色 箭头处即可更改广告页面链接的地址,