html 插入链接依靠 a 标签实现，也就是 anchor 锚标签，核心是通过 href 属性填写跳转目标地址，标签内部包裹文字或者图片，点击之后就可以完成页面跳转，这是 html 最基础核心功能之一，链接分为外部网址链接本地页面链接锚点跳转邮箱链接电话链接多种类型，很多新手容易混淆相对路径和绝对路径，本地页面跳转的时候路径写错，就会出现点击链接打不开页面 404 错误，同时还需要掌握 target 属性，控制是当前窗口打开还是新标签页打开，a 标签默认是当前页面跳转，如果想要新窗口打开，就要设置 target 等于 blank，学习 html 怎么插入链接，重点理解 href 属性，区分不同链接类型，掌握路径规则，还要知道如何去掉默认蓝色下划线，配合 css 修改链接外观。

a 标签核心属性对照表

链接分类详细说明

外部网页链接，href 填写完整 http 或者 https 开头的外网地址，点击之后跳转到别的网站，写法示例 a href=shturl.cc/pgIWZ 点击访问网站 /a

本地页面链接，属于站内跳转，使用相对路径，比如同文件夹下的 second.html，href 写 second.html，如果目标文件在上一级文件夹，就使用../ 写法，路径错误是本地链接失效最主要原因。

锚点跳转，href 填写井号加上元素 id，比如 href=top，页面内点击直接滚动到对应 id 位置，适合长页面回到顶部功能。

邮件链接，href 前面加 mailto，点击之后自动唤起本地邮件客户端，格式 mailto: 邮箱地址。

电话链接，href 前面加 tel，移动端点击可以唤起拨号界面，格式 tel: 手机号码。

图片链接，把 img 图片标签放到 a 标签内部，点击图片就可以跳转，实现图片超链接效果。

实操编写步骤

第一步，打开 html 文件，在 body 里面输入 a 开始标签。

第二步，写入 href 属性，填写目标跳转地址，外部链接填写完整网址，站内页面填写相对路径。

第三步，在 a 标签中间写入需要显示的链接文字。

第四步，添加闭合 a 标签，保存 html 文件，浏览器打开测试点击跳转。

第五步，增加 target 等于 blank，测试新标签页打开效果。

第六步，尝试制作锚点跳转，给页面元素设置 id，href 填写 id 测试滚动跳转。

第七步，使用 css 给 a 标签设置样式，修改颜色，去掉默认下划线。

常见踩坑点

href 属性如果留空，或者只写井号，点击会刷新当前页面，不是跳转外部地址。

本地链接不要直接写磁盘绝对路径，换电脑之后路径失效，推荐使用相对路径。

新标签页打开只写 target blank，部分浏览器存在安全隐患，规范写法搭配 rel noopener noreferrer。

html 怎么插入链接核心就是 a 标签加 href 属性，所有跳转功能都围绕这个标签，外部站外跳转和站内本地跳转路径写法不一样，target 控制打开窗口，后续可以搭配 css 美化链接颜色下划线 hover 悬停效果。

【常见问题】

问题 1 html 怎么插入链接点击之后想新标签页打开怎么设置

回答 1 html 怎么插入链接的时候，给 a 标签添加 target 等于 blank 属性，点击链接就会在新标签页打开，规范写法同时加上 rel noopener noreferrer 提升安全性。

问题 2 html 怎么插入链接本地页面跳转提示找不到页面是什么原因

回答 1 html 怎么插入链接本地页面跳转报错，绝大多数是相对路径书写错误，需要确认 html 文件和目标页面的文件夹层级，正确填写相对路径，不要使用本机磁盘绝对路径。

问题 3 html 怎么插入链接可以把图片做成可点击链接吗

回答 1 html 怎么插入链接可以实现图片链接，把 img 图片标签嵌套在 a 标签内部，给 a 标签写 href 跳转地址，点击图片就可以触发跳转。

问题 4 html 怎么插入链接页面内回到顶部是哪种链接

回答 1 html 怎么插入链接里面页面内回到顶部属于锚点链接，href 填写 top，并且给顶部元素设置 id 等于 top，点击之后页面滚动到顶部位置。

【免责申明】

本文为 html 怎么插入链接基础教学，示例为原生 html 标准语法，不同浏览器对 tel mailto 协议唤起软件存在差异，代码仅用于学习演示，正式项目需要校验外链安全性，本文不保证所有特殊协议都可以正常唤起，请勿直接上线生产环境。