HTML中的超链接

简介: HTML中的超链接

超链接:也就是我们的href标签,它的出现是为了放入我们的超链接路径。


超链接的特点:


1:链接路径可以是一个网络中的路径,也可以是一个本地的路径!

2:超链接的特点:鼠标停留在超链接上自动变成小手,在网页中被加入超链接的文字会自动添加下划线!


3:图片可以做热链接吗?可以,待会会有代码演示。


代码示例:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>超链接</title>
  </head>
  <body>
    <!-- 链接到百度 -->
    <!-- href 属性表示:hot references,用来指定链接的路径 -->
    <a href="http://www.baidu.com">百度</a>
    <br>
    <!-- 链接路径可以是一个网络中的路径,也可以是一个本地的路径! -->
    <!-- 超链接的特点:鼠标停留在超链接上自动变成小手,超链接自动添加下划线! -->
    <a href="004-表格.html">链接到本地的表格!</a>
    <br>
    <a href="http://www.jd.com">京东商城</a>
    <br>
    <a href="http://www.126.com">126邮箱</a>
    <br>
    <a href="https://map.baidu.com">百度地图</a>
    <!-- 图片可以做热链接吗?可以 -->
    <a href="https://map.baidu.com">
      <!-- 标签嵌套使用! -->
      <img src="images/bd.png" width="200px" title="点击我跳转到百度地图哦!" />
    </a>
  </body>
</html>

上述代码可直接在Hbuilder中直接运行即可,观察代码的效果。


下面来介绍超链接中的target属性,target属性用于设置最终窗口打开的位置。


target属性可以有以下的赋值,分别代表当点击我们的超链接后,所跳转的页面所显示的不同位置,下面来看:

    _blank:跳转后显示在新窗口

    _self:跳转后显示在当前窗口

    _parent:跳转后显示在当前窗口的父窗口

    _top:跳转后显示在当前窗口的顶级窗口


相关文章
如何在HTML文件中添加超链接
如何在HTML文件中添加超链接
376 0
|
前端开发
HTML超链接大致分为以下7类
HTML超链接大致分为以下7类
293 1
|
11月前
|
JavaScript 前端开发 UED
HTML 超链接的多种类型及应用
【10月更文挑战第17天】HTML 超链接类型丰富多样,它们共同构成了网页中不可或缺的导航和交互元素。通过合理地选择和运用这些超链接类型,我们可以为用户创造更加流畅和便捷的浏览体验,提升网站的可用性和吸引力。
483 1
|
11月前
|
前端开发
【HTML】img标签和超链接标签
【HTML】img标签和超链接标签
156 2
|
前端开发 Windows
【前端web入门第一天】02 HTML图片标签 超链接标签 音频标签 视频标签
本文档详细介绍了HTML中的图片、超链接、音频和视频标签的使用方法。首先讲解了`&lt;img&gt;`标签的基本用法及其属性,包括如何使用相对路径和绝对路径。接着介绍了`&lt;a&gt;`标签,用于创建超链接,并展示了如何设置目标页面打开方式。最后,文档还涵盖了如何在网页中嵌入音频和视频文件,包括简化写法及常用属性。
243 13
HTML的超链接
HTML的超链接。
141 6
|
前端开发
前端第二课,HTML,alt,title,width/heigh,border,<a>超链接,target,tr,td,th
前端第二课,HTML,alt,title,width/heigh,border,<a>超链接,target,tr,td,th
|
前端开发
HTML与CSS实现网页的超链接及美化
HTML与CSS实现网页的超链接及美化
338 0
HTML与CSS实现网页的超链接及美化
|
前端开发
HTML 超链接
【7月更文挑战第1天】HTML 超链接。
136 1
|
前端开发
HTML 超链接
HTML 超链接。
181 32