开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第11天，点击查看活动详情

嗨，大家好，我是异星球的小怪同志

一个想法有点乱七八糟的小怪

如果觉得对你有帮助，请支持一波。

希望未来可以一起学习交流。

一、超链接标签HTML

在标签中，< a>标签用于定义超链接，作用是从一个页面链接到另一个页面。

1.链接的语法格式

< a href="跳转目标" target="目标窗口的弹出方式" >文本或图像< /a >

两个属性的作用如下：

属性	作用
href	用于指定链接目标的url地址，（必须属性）当为标签应用href属性时，它就具有了超链接的功能。
target	用于指定链接页面的打开方式，其中_self为默认值，_blank为在新窗口中打开方式。

2.链接分类

（1）外部链接:比如 < a href="http:// www .baidu.com " > 百度。

（2）内部链接:网站内部页面之间的相互链接. 直接链接内部页面名称即可，例如 < a href="index.html"> 首页。

（3）空链接: 如果当时没有确定链接目标时，< a href="#"> 首页。

（4）下载链接: 如果 href 里面地址是一个文件或者压缩包，会下载这个文件。

（5）网页元素链接: 在网页中的各种网页元素，如文本、图像、表格、音频、视频等都可以添加超链接。

（6）锚点链接: 点我们点击链接,可以快速定位到页面中的某个位置。

（6.1）在链接文本的 href 属性中，设置属性值为 #名字的形式，如< a href="#two" >第2集< /a>

(6.2)找到目标位置标签，里面添加一个 id 属性 = 刚才的名字，如：< h3 id="two">第2集介绍 < /h3 >

那我们用代码来演示一下：

（1）超链接

<body>
    <h4>（1）外部链接</h4>
     <a href="https://www.bilibili.com/" target="_self">哔哩哔哩</a>
</body>

总结一下：target打开窗口的方式 _self是默认值，也就是在当前窗口打开

<body>
    <h4>（1）外部链接</h4>
     <a href="https://www.bilibili.com/" target="_blank">哔哩哔哩</a>
</body>

总结一下：target打开窗口的方式 _blank是新窗口打开页面

（2）内部链接——在同一个目录文件下

<body>
    <h4>（2）内部链接</h4>
     <a href="绝对路径.html">绝对路径</a>
</body>

（3）空链接——是打不开链接的

<body>
    <h4>（3）空链接</h4>
     <a href="#">绝对路径</a>
</body>

（4）下载链接——地址链接是文件.exe或者是.zip等压缩包形式

<body>
    <h4>（4）下载链接</h4>
     <a href="img.zip">下载文件</a>
</body>

（5）网页元素链接——文本、图像、表格、音频、视频等

<body>
    <h4>（5）网页元素链接</h4>
     <a href="https://juejin.cn/"><img src="img.jpg" alt="1"></a>
</body>

（6）锚点链接

<body>
    <h2>目录</h2>
    <br>1.大事件         
    <br> <a href="#early life experience">2.早年经历 </a>
    <br>3.演艺经历
    <br>4.个人生活
    <br> 5.主要作品
    <h3 id="early life experience">早年经历</h3>

HTML入门零基础教程（七）