一、超链接标签的基本使用

超链接是浏览者和服务器的交互的主要手段，也叫超级链接或a链接，是网页中指向一个目标的连接关系，这个目标可以是网页、网页中的具体位置、图片、邮件地址、文件、应用程序等。

超链接是网页中最重要的元素之一。一个网站的各个网页就是通过超链接关联起来的，用户通过点击超链接可以从一个网页跳转到另一个网页。

几乎可以在所有的网页中找到链接。点击链接可以从一张页面跳转到另一张页面。例如,在阅读某个网站时，遇到一个不认识的英文，你只要在这个单词上单击一下，即可跳转到它的翻译页面中，看完单词的解释后点一下返回按钮，又可继续阅读，这就是超链接的常见用途。还有经常到购物网站中去，我们都是在百度搜索，然后点击对应的搜索项进入到对应的购物网站的，这也是超链接的作用。超链接的属性：

属性 值 描述
href 网络链接 [ 例如: http://www.baidu.com ] 本地链接 [ 例如：F:\html\index.html ] 规定链接的跳转目标
title 百度 链接的提示信息
target _blank [ 在新建窗口中打开网页 ] _self [ 默认值，覆盖自身窗口打开网页 ] _parent [ 在父级框架中打开网页 ] _top [ 在顶级框架中打开网页 ] framename [ 在指定的框架中打开网页] 与前面四项固定值不同，framename是泛指，并不是这个值，这点将在后面框架部分内容中详细介绍，这里可以暂时先略过

1、href是超链接最重要的属性，规定了用户点击链接以后的跳转目标，这个目标可以是 网络连接，也可以是本地连接。

2、网络链接指的是依靠网络来进行关联的地址，一般在地址前面是以 http://或者https://这样开头的，如果没有网络，则用户点击了超链接也无法访问对应的目标。

3、本地链接指的是本地计算机的地址，一般在地址前面是以 file:///开头或直接以 C:/、D:/、E:/开头的，不需要经过网络。

4、如果href的值留空，则默认是跳转到当前页面，也就是刷新当前页面。

二、超链接的锚点应用

锚点( anchor )是超链接的一种应用，也叫命名锚记，锚点可以像一个定位器一样，可以实现页面内的链接跳转，运用相当普遍。例如，我们有一个网页，由于内容太多，导致页面很长，而且里面的内容，可以分为N个部分。这样的话，我们就可以在网页的顶部设置一些锚点，这样便可以方便浏览者点击相应的锚点，到达本页内相应的位置，而不必在一个很长的网页里自行寻找。又例如，我们页面中，有个链接需要跳转到另一个页面的中间或者脚部去，这时候也可以运用上锚点技术来解决这个问题。

<!DOCTYPE HTML>

<html lang="en-US">

  <head>

    <title>锚点的使用</title>

  </head>

  <body>

  <a href="#i1">第一章</a>

  <a href="#i2">第二章</a>

  <a href="#i3">第三章</a>

   <div id="i1">

      <p>第一章内容</p>

  </div>

   <div id="i2">

      <p>第二章内容</p>

  </div>

  <div id="i3">

     <p> 第三章内容</p>

  </div>

  </body>

</html>

　　

HTML——超链接标签的更多相关文章

  1. 超链接标签a样式生效，取消下划线，文字垂直（上下）居中

    直接设置超链接标签a的属性时并不会生效, 需要将display属性改为inline-block, 即style="display:inline-block" 添加标签a时,默认是有 ...

  2. html标签，格式控制标签，内容容器标签，超链接标签，图片标签，表格

    打开DREAMWEAVER,新建HTML,如下图: body的属性: bgcolor 页面背景色 background  背景壁纸.图片 text  文字颜色 topmargin  上边距 leftm ...

  3. html body的属性 格式控制标签 内容容器标签 超链接标签 图片标签 表格

    一.body的属性 <body  bgcolor  页面背景色 background 背景壁纸.图片 text文字颜色 topmargin上边距 leftmargin左边距 rightmargi ...

  4. 我给女朋友讲编程html系列(3) --html中的超链接标签-a标签 和 框架frame与框架集frameset

    我们浏览网页的时候,当单击某段文字或图片时,就会打开一个新的网页,这里面就使用了超链接. 就比如下图是一个导航类网页,当你单击某个链接就会打开新的网页. 比如,我拿我的qq空间“金河访谈”举例,新建一 ...

  5. AngularJS <a> 超链接标签不起作用？

    问题描述: Angular JS app中,使用超链接标签<a href='location'>click</a> 不起作用. 解决方法: 如果你不巧配置了$locationP ...

  6. 第二天(就业班) html的引入、html常用标签、实体标签、超链接标签、图片标签、表格、框架标签、表单[申明：来源于网络]

    第二天(就业班) html的引入.html常用标签.实体标签.超链接标签.图片标签.表格.框架标签.表单[申明:来源于网络] 第二天(就业班) html的引入.html常用标签.实体标签.超链接标签. ...

  7. img图像标签和超链接标签a

    图像标签语法:<img src="" alt="".../> img属性:src=""  显示图像的URLalt="& ...

  8. HTML第四耍 超链接标签

    1.HTML 超链接(链接) 一.HTML 超链接 HTML中使用超级链接与网络上的另一个文档相连.几乎可以在所有的网页中找到链接.点击链接可以从一张页面跳转到另一张页面. 超链接可以是一个字,一个词 ...

  9. 前端 HTML body标签相关内容 常用标签 超链接标签 a标签

    超链接标签 <a> 超级链接<a>标记代表一个链接点,是英文anchor(锚点)的简写.它的作用是把当前位置的文本或图片连接到其他的页面.文本或图像,也可以是相同网页上的不同位 ...

  10. AngularJS 中<a> 超链接标签不起作用？

    开始时遇到个问题,单页应用<a>元素链接点击就是不跳转页面,使用超链接标签<a href='group'>click</a> 不起作用. 解决方法: 如果你不巧配置 ...

随机推荐

  1. openGauss社区入门（openGauss-常用数据类型）

    常用数据类型 数据类型 说明 布尔类型 boolean true/'1'/'yes' false/'0'/'no' 数值类型 smallint 两字节 int 4 字节 bigint 8 字节 dou ...

  2. 重新点亮linux 基本软件————防火墙[一]

    前言 简单介绍一下linux的防火墙. 正文 防火墙分类: 软件防火墙和硬件防火墙 包过:过滤防火墙和应用层防火墙 iptables 的表和链 规则表: filter nat mangle raw f ...

  3. css 文字溢出省略号

    前言 css 文字溢出后显示省略号,这是一个非常常规的操作,但是你会发现在网上很多给出的例子两行之后显示省略号,却没有用. 这是为什么呢?please look follow. 正文 在一行省略的: ...

  4. 重新整理.net core 计1400篇[二] (.net core 改造控制台项目)

    前言 为.net core 命令行的基础上写的,如果有兴趣的话,可以去看我的.net core 前文. 下面介绍如何将.net core控制台转换为.net core web应用. 正文 如果我们要实 ...

  5. Lattice Crosslink开发简介

    选择lattice的Crosslink器件,大多是因为它功耗比较低.价格便宜,开发也比较简单,相对来说更容易上手.大部分用在手机屏,摄像头模组和平板方面. Crosslink的开发工具是Diamond ...

  6. 还原数据库从远端环境到本地开发环境，数据SINGLE_USER问题

    要还原到本地开发环境,首先要detach本地数据库或者是删除本地数据库,不然提示在使用中还原不了,但是搞过几次去做detach和drop数据库时,总是不成功,最后还出现个单用户模式,莫名奇妙 为此网上 ...

  7. 如何发起 MQTT 亿级连接和千万消息吞吐性能测试

    ​简介:MQTT 协议凭借简单易实现.支持 QoS.报文小等特点,占据了物联网协议的半壁江山. 作者:亦炎 随着 5G 时代的来临,万物互联的伟大构想正在成为现实.联网的物联网设备 在 2021 年已 ...

  8. 云原生数据仓库AnalyticDB支撑双11，大幅提升分析实时性和用户体验

    ​简介:2021年双十一刚刚落幕,已连续多年稳定支持双十一大促的云原生数据仓库AnalyticDB,今年双十一期间仍然一如既往的稳定.除了稳定顺滑的基本盘之外,AnalyticDB还有什么亮点呢?下面 ...

  9. DataWorks 功能实践速览03期 — 生产开发环境隔离

    ​简介: DataWorks功能实践系列,帮助您解析业务实现过程中的痛点,提高业务功能使用效率! 往期回顾: DataWorks 功能实践速览01期--数据同步解决方案:为您介绍不同场景下可选的数据同 ...

  10. [FAQ] Git远程仓库想把目录大写改为小写，windows本地不识别的的处理

      通过四步操作: 1. 先把忽略大小写设为false,即区分大小写git config core.ignorecase false 2. 拷贝出来备份那几个大写的目录,随后分支上操作删除,提交到远程 ...