title 属性是为 <a> 标签添加提示最直接的方式，鼠标悬停时显示原生 tooltip，但仅桌面端有效、移动端通常不支持，且需避免空值、缺失 href、CSS 干扰及语义冗余。
title 属性是给 <a> 标签加提示最直接的方式
在 HTML 中，title 是所有元素都支持的全局属性，对 <a> 标签来说，它会在鼠标悬停时显示浏览器原生 tooltip。不需要 JS、CSS 或额外库。
写法就是直接在 <a> 标签里加 title="文字"：
<a href="https://example.com" title="跳转到示例网站">点我</a>
注意：这个提示只在桌面端悬停触发，移动端通常不显示（iOS Safari 完全忽略 title，Android 浏览器行为也不一致）；文字内容不能含换行或 HTML 标签，否则会被当作纯文本渲染或截断。
title 提示不显示？先检查这几个常见问题
不是所有“没看到提示”都是代码写错了，更多是环境或语义导致的：
立即学习“前端免费学习笔记（深入）”；
-
title值为空字符串（title=""）或只含空格，浏览器会跳过渲染 - 链接本身没有
href属性（比如<a onclick="doSomething()">），部分浏览器（如 Firefox）会禁用title提示 - CSS 设置了
pointer-events: none或opacity: 0，导致悬停事件无法触发 - 用户启用了高对比度模式（Windows）或某些读屏辅助工具，可能主动屏蔽
title
想兼容移动端或自定义样式？得换方案
title 的局限性决定了它不适合需要跨端一致提示或品牌化 UI 的场景。替代思路有：
- 用
aria-label配合 JS 实现点击/聚焦时的浮层（适合无障碍 + 自定义样式） - 用
data-tooltip+ CSS::after伪元素模拟提示（需处理显示/隐藏逻辑和定位） - 对关键操作链接，直接把说明文字放在链接旁（如
<a href="...">删除</a> <span class="hint">不可恢复</span>），最可靠也最易读
别为了“有提示”硬套 title，尤其当目标用户大量使用手机或依赖辅助技术时。
title 不是 alt，别和图片提示混淆
新手常误以为 title 和 alt 功能类似，但它们定位完全不同：
-
alt是图片的**替代文本**，用于加载失败、SEO、屏幕阅读器朗读，必须写且应描述图像内容 -
title是**补充说明**，属于锦上添花，可选；对链接来说，它不该重复href或链接文本已表达的信息（比如链接文字是“GitHub 主页”，title再写“GitHub 主页”就冗余） - 如果链接内嵌图片，
<a>的title和<img>的alt各司其职，不要互相覆盖
真正容易被忽略的是语义合理性——很多页面给每个链接都塞 title，结果全是“点击访问”“跳转页面”这种废话，反而干扰信息获取。
