abbr 标签必须带 title 属性才具备缩写语义，否则仅为普通内联元素；title 值须为简洁纯文本，仅对文档中首次出现且读者可能不熟悉的缩写使用，html5 已废弃 acronym。
abbr 标签必须带 title 属性才有效
不加 title 的 abbr 就是普通内联元素，屏幕阅读器不会读、鼠标悬停没提示、SEO 也当它不存在。HTML 规范明确要求：缩写语义只靠 title 激活。
常见错误是只写 <abbr>HTTP</abbr>，结果什么都没发生。正确写法必须是：<abbr title="HyperText Transfer Protocol">HTTP</abbr>。
title 值要简洁纯文本，不支持 HTML、不换行、不加冗余描述。比如 title="Cascading Style Sheets" 合适，title="The stylesheet language used in web development (CSS)" 就超标了。
哪些词该用 abbr，哪些不该用
核心判断标准是：这个词在当前文档中是否「首次出现 + 读者可能不熟悉全称」。
- ✅ 适合：
<abbr title="Application Programming Interface">API</abbr>（技术文档面向非开发者时） - ✅ 适合：
<abbr title="United States of America">USA</abbr>（国际读者场景） - ❌ 不该用：
<abbr title="HyperText Markup Language">HTML</abbr>（已成通用词汇，加了反而干扰） - ❌ 不该用：
<abbr title="JavaScript">JS</abbr>（JS是简称，不是标准缩写；JavaScript本身也不是缩写） - ❌ 不该用：
<abbr title="version 2">v2</abbr>（含数字的简写不属于缩写范畴）
移动端和辅助技术对 title 的支持很弱
桌面 Chrome/Firefox 悬停会显示 tooltip，但 iOS Safari 基本不触发，Android Chrome 也常静默——不能靠它传递关键信息。
屏幕阅读器行为也不统一：VoiceOver 可能朗读 title，NVDA 有时跳过，尤其当 abbr 嵌套在链接或按钮里时。
真正稳定可用的是 DOM 接口：document.querySelector('abbr').title 总能取到值，JS 和无障碍工具链可依赖这个。
如果需要跨设备可靠提示，得额外加方案：class="has-tooltip" 配合 CSS ::after 或 aria-describedby 关联隐藏段落，abbr 只负责语义层。
别再用 acronym，HTML5 已彻底废弃
acronym 在 HTML5 中被移除，所有浏览器都把它当作未知标签处理，语义丢失、验证失败、辅助技术无法识别。
过去有人误以为 acronym 专用于首字母缩略词（如 NASA），abbr 用于截断缩写（如 Mr.），但 W3C 从未这样区分。现在统一用 abbr：
❌ 错误：<acronym title="National Aeronautics and Space Administration">NASA</acronym>
✅ 正确：<abbr title="National Aeronautics and Space Administration">NASA</abbr>
实际项目中最容易被忽略的，是“只在首次出现时标”，后续同一篇文档里再出现 API，title 可省略，但跨页面或长文档建议保留，避免上下文断裂。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
