移动端自动识别并高亮邮箱和电话是ios safari及部分android浏览器的默认智能识别功能，可通过禁用，需确保格式正确且置于中。
为什么移动端会自动识别并高亮邮箱和电话
这是 iOS Safari 和部分 Android 浏览器的默认行为，它们会扫描页面文本，对符合 mailto: 或 tel: 模式的内容（比如 user@example.com、+86 138-0013-8000）主动添加点击跳转逻辑。这不是 bug，而是内置的“智能识别”功能。
用 format-detection 关闭自动识别
在 中加入以下 <meta> 标签即可禁用：
<meta name="format-detection" content="telephone=no, email=no">
注意两点：
-
content值必须是telephone=no, email=no这种逗号分隔格式，中间有空格；写成telephone=no;email=no或漏掉空格会失效 - 该 meta 只对当前页面生效，不继承，每个需要控制的页面都得单独加
- 部分旧版 Android WebView（如 4.4 之前）可能不支持
email=no，但telephone=no兼容性更好
替代方案：用 CSS 阻止点击穿透（当 meta 不生效时）
如果遇到某些 WebView 或定制浏览器忽略 format-detection，可配合 CSS 强制移除默认样式与交互：
Comet AI 浏览器
下载
下载 Comet AI 浏览器，体验由 Perplexity AI 驱动的革命性上网方式。内置 AI 助手可实时总结网页、跨标签页对比信息、自动执行任务。告别繁琐操作，让 AI 成为你的浏览副驾，大幅提升研究与工作效率。支持 Windows、macOS、Android 和 iOS。
/* 移除 iOS 自动添加的蓝色高亮和下划线 */<br>a[href^="tel:"],<br>a[href^="mailto:"],<br>span:has(>a[href^="tel:"]),<br>span:has(>a[href^="mailto:"]) {<br> -webkit-text-decoration: none !important;<br> color: inherit !important;<br> pointer-events: none;<br>}
但要注意：pointer-events: none 会让整个元素不可点击——如果你本就希望用户能手动复制邮箱/电话，这个方案反而破坏可用性。
验证是否生效的快速方法
真机测试最可靠，模拟器容易误判。操作步骤：
- 用 iPhone 打开页面，长按疑似邮箱或号码的文字，看是否弹出「复制」而非「发送邮件」或「拨打」菜单
- 检查 Safari 开发者工具的「Elements」面板，确认
<meta name="format-detection">已正确注入且没有被 JS 动态移除 - 避免在 SPA 应用中只在首屏加该 meta，后续路由切换后需重新注入（如 React 中需在组件挂载时写入
document.head）
真正起作用的是 meta 标签本身，不是 JS 或 CSS；但很多问题出在它没被浏览器读到——比如放在 里，或者被构建工具误删。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
