HTML——链接标签、锚标签、功能标签

最新推荐文章于 2022-01-13 10:43:36 发布

原创最新推荐文章于 2022-01-13 10:43:36 发布 · 311 阅读

1 ·

CC 4.0 BY-SA版权

HTML 专栏收录该内容

9 篇文章

订阅专栏

本文详细介绍了HTML中超链接的应用方式，包括文本链接、图像链接、锚点链接及功能性链接等。通过实例展示了如何创建指向不同目标的链接，并解释了目标窗口属性的作用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>链接标签</title>
</head>
<body>

<a name="top">顶部</a>




<!--文本超链接、图像超链接
href：必填，表示跳转到那个界面
_blank:生成一个新网页标签打开
_self：在原标签中打开，该功能是默认的
-->
<a href="我的第一个网页.html">点击我跳转到我的第一个网页</a>

<br>

<a href="https://www.baidu.com">点击跳转到百度</a>

<br>

<a href="我的第一个网页.html">
    <img src="../resources/image/中指.jpg" alt="图片名称中指" title="呵呵" width="400" height="400">
</a>

<br>

<a href="https://www.baidu.com">
    <img src="../resources/image/中指.jpg" alt="图片名称中指" title="呵呵" width="400" height="400">
</a>

<br>

<a href="https://www.baidu.com" target="_blank">
    <img src="../resources/image/中指.jpg" alt="图片名称中指" title="呵呵" width="400" height="400">
</a>

<br>

<a href="https://www.baidu.com" target="_self">
    <img src="../resources/image/中指.jpg" alt="图片名称中指" title="呵呵" width="400" height="400">
</a>

<br>





<!--锚链接
作用跳转到指定位置


1.需要一个标记
2.跳转到标记就行

用#加名字
-->

<a href="#top">跳转到顶部</a>

<br>

<a href="我的第一个网页.html#head">跳转到我的第一个网页的顶部</a>

<br>

<!--功能性链接

1.邮件链接
2.QQ链接
  需要在QQ推广里面加载
-->

<a href="mailto:1103349536@qq.com">QQ邮箱联系我</a>

<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=&site=qq&menu=yes">
    <img border="0" src="http://wpa.qq.com/pa?p=2::51" alt="点击和我交谈" title="点击和我交谈"/></a>


</body>
</html>

https://www.bilibili.com/video/BV1x4411V75C?p=5