HTML中超链接统一使用<a>标签实现，必须显式设置href属性（含协议或相对路径），搭配target和rel属性确保安全与功能正确。
用 <a> 包裹文本是最直接的方式
HTML 中没有“文本超链接标签”这种独立类型，所有超链接都统一通过 <a> 元素实现，无论里面是纯文本、<strong>、<span> 还是 <img>。关键不是“文本标签怎么变链接”，而是“怎么把任意内容放进 <a> 里”。
常见错误现象：写成 <p><a href="...">文字</a></p> 没问题，但误以为 <strong> 或 <em> 自带链接能力，结果点了没反应。
- 必须显式使用
<a href="目标地址">...</a>结构 - href 值不能为空，也不能只写域名（如
example.com），必须带协议（https://）或相对路径（about.html） - 若目标是当前页面某处，href 写成
#section-id，且对应位置要有id="section-id"
href 值类型决定链接行为，别混用
同一个 <a> 标签，href 写法不同，浏览器处理逻辑完全不同，直接影响是否跳转、跳到哪、是否下载等。
-
href="https://baidu.com"：打开外部网页（必须含协议，否则变成相对路径，可能 404） -
href="contact.html"：打开同目录下的 HTML 文件（相对路径，不加斜杠） -
href="./assets/resume.pdf"：打开子目录文件（./明确表示当前目录，避免歧义） -
href="mailto:support@example.com"：点击触发默认邮件客户端 -
href="tel:+8613800138000"：移动端点击拨号（注意 + 和国家码格式） -
href="#"：仅滚动到页面顶部，无跳转；常配合 JS 使用，但需防默认行为干扰
target="_blank" 不加 rel="noopener noreferrer" 有安全风险
很多人只记得加 target="_blank" 让链接在新标签页打开，却忽略它带来的安全隐患：新开页面可通过 window.opener 访问原页面的 window 对象，可能被恶意站点利用做钓鱼或跳转劫持。
立即学习“前端免费学习笔记（深入）”；
- 正确写法必须是：
<a href="..." target="_blank" rel="noopener noreferrer">链接文本</a> -
rel="noopener"切断 opener 引用，noreferrer还能防止 Referer 泄露来源 - 如果只是页面内锚点跳转（如
href="#top"），完全不需要 target 属性 - 内部链接（同域）一般用
target="_self"（默认值，可省略），不用额外加 rel
图片当链接时，嵌套要干净，别留空白字符
把 <img> 放进 <a> 是合法且常用的做法，但 HTML 解析对换行和空格敏感，容易在渲染时多出空白间隙。
- 错误写法（含换行和缩进）：
<a href="detail.html"> <img src="thumb.jpg" alt="详情"> </a>
部分浏览器会在<a>内生成文本节点，导致图片下方出现小空隙 - 正确写法（紧凑无空白）：
<a href="detail.html"><img src="thumb.jpg" alt="详情"></a> - 更稳妥做法：给
<img>加style="display:block;"或用 CSS 重置a img { vertical-align: top; }
