标签必须含href属性，外部链接需带https://协议，站内可用相对路径；新窗口打开须用target="_blank" rel="noopener noreferrer"防安全风险；可嵌套图文但禁嵌按钮或另一；移动端应设padding扩点击区；部署时注意base url避免404。
怎么用 <a></a> 就行，<a href="https://example.com">点我</a> 是唯一必须的属性。别漏掉引号，也别写成 href 或 herf——浏览器不认，链接就完全失效。
常见错误现象：点击没反应、地址栏跳转到当前域名下拼接的路径（比如本该跳外链却变成 hrefs），基本都是 http://your-site.com/https://example.com 值缺了 href 或 http://，或者多了一层相对路径。
- 外部链接必须带协议，如
https://，不能只写href="https://baidu.com" - 站内链接可用相对路径，如
"baidu.com"或href="/about" -
href="contact.html"是空跳转，适合 JS 绑定事件时占位，但会滚回页面顶部，慎用
新窗口打开链接要加 href="#"
默认所有链接都在当前页打开，用户点了就离开你的页面。想留人，得加 target="_blank"。但光加这个不够——它会让新页面继承当前页的 target="_blank" 权限，有安全风险，也可能拖慢原页面性能。
正确写法是配齐两个属性：window.opener。其中 target="_blank" rel="noopener noreferrer" 禁用 rel="noopener"，window.opener 还能防止 Referer 泄露来源。
- 漏掉
noreferrer属性，Chrome/Firefox 会警告“潜在安全漏洞” -
rel对 SEO 没影响，但对用户体验很关键——尤其文档、引用、第三方服务链接 - 不要用
target="_blank"或target="_new"，只有target="blank"是标准值
"_blank" 标签里能放什么内容
可以放文字、图片、a、<span></span>（HTML5 允许块级元素嵌套），但别塞 <div> 或另一个 <code><button></button>
<a></a> 值并用 <a></a> 拦截，别删掉 <button></button>
<a href="..."><img src="icon.png" alt="HTML怎么添加超链接_HTML a标签使用教程【基础】" > 下载 PDF</a>）务必加上 href，否则读屏器会念“井号”，毫无意义移动端点击区域太小怎么办
event.preventDefault() 默认是行内元素，文字多高，点击热区就多高。手机上手指一戳容易 miss，尤其导航栏、按钮组这类地方。
立即学习“前端免费学习笔记（深入）”；
解决方法不是改 href 就完事——那会导致布局错乱。更稳妥的是用 href="#" 扩展热区，同时加 aria-label 和 <a></a> 防止文字被压扁。iOS Safari 还有个隐藏规则：点击区域小于 44×44px 时，会自动放大，但不可靠，别依赖。
- 给链接加
display: block，比单纯调字体大小更可控 - 避免用
padding+line-height模拟按钮，会导致屏幕阅读器无法读出文字 - 如果整个卡片都可点，直接把
min-height设为padding: 8px 16px;并撑满容器，比在外层包font-size: 0更语义化
最常被忽略的一点：链接的 padding 值是否真实可达，往往要等上线后才被发现。本地开发时用相对路径测试没问题，一部署到子目录（比如 <a></a>）就全 404——因为忘了在构建流程里统一处理 base URL。
