title属性是为标签添加悬停提示的正确方式,仅桌面端鼠标悬停时生效,移动端不支持;alt属性不适用于,强行使用将被忽略且导致验证失败。

直接用 title 属性,不是 alt,也不是 JS 模拟 —— 但得知道它只在悬停时生效,点击本身不会触发提示。
为什么不能用 alt 给 <a> 加提示
alt 是专为替换内容(如 <img>、<input type="image">)设计的属性,<a> 标签根本不支持它。浏览器会忽略 alt,W3C 验证也会报错。强行写上不仅无效,还可能干扰可访问性工具对页面结构的判断。
title 属性怎么写才真正生效
写法很简单:<a href="#" title="退出全屏"></a>。但能否显示,取决于几个现实条件:
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML,替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度,HTML 能同时承载排版、表格、SVG 等。
- 元素必须能被鼠标自然悬停到 —— 如果父容器有
overflow: hidden或pointer-events: none,提示框会被压制或完全不出现 - 移动端(尤其是 iOS Safari)基本不支持 hover,长按也不会弹出
title,别把它当点击反馈用 -
title值只能是纯文本,含换行符、<br>或多余空格会导致截断或渲染异常 - 如果链接内没有可见文字(比如只放了一个图标),单靠
title不够:屏幕阅读器虽会读,但优先级低于aria-label,建议补上aria-label="退出全屏"
点击时想有提示?title 不是为此设计的
浏览器原生机制里,title 只响应 hover 和键盘焦点(部分浏览器),和 click 事件无关。如果你需要“点击后提示”,得换思路:
- 用
aria-live区域 + JS 在 click 后动态插入提示文案,供屏幕阅读器朗读 - 用 CSS +
:active状态配合伪元素做视觉反馈,比如点击时显示一个带文字的div - 如果只是想让用户确认操作,更稳妥的是在点击前用
confirm()或自定义 modal,而不是依赖title
最常被忽略的一点:很多人把 title 当作“万能提示开关”,但它既不能控制样式,也不能保证在所有设备上出现,更不该承载关键信息。真要提示用户,优先用语义化标签、aria-label 或轻量 JS 控制的 tooltip 组件。

















