chrome/firefox/edge 的 title 悬浮提示实际触发延迟为 500–1000ms，不可配置：chrome 约 700ms，firefox 可达 1000ms，edge 与 chrome 一致；title 非 dom 节点，不响应 css（包括 transition-delay）、无法选中或样式化，移动端基本无 hover，故延迟无效；真正可控方案须用 js 监听 mouseenter/mouseleave 并手动控制显隐定时器。
调不了。浏览器硬编码的延迟，HTML 和 CSS 都没接口改。
Chrome/Firefox/Edge 的 title 悬浮延迟是多少
实际触发时间在 500–1000ms 之间，具体由浏览器实现决定：
- Chrome 通常约 700ms
- Firefox 在部分系统上可能更接近 1000ms
- Edge 行为基本与 Chrome 一致
这个时间不是“默认值”，而是不可暴露、不可覆盖的内部阈值；title 属性本身不接受任何 delay 参数，data-delay、tooltip-delay 等写法完全无效。
为什么 CSS transition-delay 对 title 无效
title 提示框不是 DOM 节点，浏览器用原生 UI 绘制（比如 Windows 的 tooltip 控件或 macOS 的 NSPopover），不参与页面渲染流程：
- 无法被 document.querySelector('[title]') 选中
- 不能加 class 或 style
- transition-delay、opacity、伪元素等 CSS 手段全部不起作用
- 写 title { display: none } 这类规则也无效——它根本不在样式树里
移动端根本没 hover，谈不上延迟
iOS Safari 和主流安卓 WebView 基本不响应 hover，也就没有“悬停后多久显示”这回事：
- 少数情况下长按 <button></button> 可能触发，但行为不稳定、不可控
- title 在移动端既不提升可访问性，也不保证可见性
- 如果你依赖 title 给移动用户提示关键操作（比如“删除后不可恢复”），等于没提示
真正能设延迟的只有 JS 方案
必须放弃 title，改用自定义 DOM 元素 + 事件监听：
- 用 mouseenter + setTimeout 控制显示时机（如 300ms）
- 用 mouseleave + setTimeout 控制隐藏时机（如 200ms）
- 每次 mouseenter 都要先 clearTimeout(hideTimer)，否则快速进出会导致提示卡住
- 提示框本身得设 pointer-events: none，不然鼠标移过去就触发 mouseleave
- 键盘用户需同步监听 focus/blur，并用 aria-describedby 关联
最容易被忽略的不是“怎么加 delay”，而是「延迟是否匹配用户真实意图」：鼠标刚停就弹太急，移开又收太快，用户根本来不及读完。这需要实测交互节奏，而不是套个 setTimeout(500) 就完事。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
