应使用tel:和mailto:协议配合标签实现点击拨号与发邮件：tel:+8613800138000确保国际区号，mailto:hello@example.com?subject=应聘前端岗位&body=您好%20简历已附，注意URL编码、避免中文邮箱、禁用target="_blank"，并需本地服务器预览测试。
用 tel: 和 mailto: 协议实现点击拨号与发邮件
HTML 简历里放联系方式，不能只写一串数字或邮箱地址——得让手机点一下就弹拨号界面，电脑点一下就自动打开邮件客户端。核心就是用好两个 URI 协议：tel: 和 mailto:，它们是浏览器原生支持的，无需 JS 就能生效。
常见错误是直接写 13800138000 或 name@example.com，这纯属静态文本，用户还得手动复制粘贴。正确做法是套上 @#@#@#@#@#@#@#@#@#@0 —— 注意加 +86 国际区号更可靠，iOS/Android 都能识别；不加可能在某些安卓机型上无法触发拨号
@#@#@#@#@#@#@#@#@#@1 —— subject 和 body 参数用 & 连接（不是 &），空格要 URL 编码（如 %20），否则邮件客户端可能截断内容中文邮箱或带空格的电话号码怎么处理？
如果邮箱用户名含中文（如 张三@example.com），或电话带括号、短横线（如 (010) 1234-5678），这些字符在 tel: 或 mailto: 中必须剔除或转义，否则协议失效。
-
tel:只接受数字、+、#、*和部分分隔符（如-、.、( )）；但稳妥起见，建议只保留+和数字，比如+8613800138000 -
mailto:的邮箱部分不能含中文，必须是 ASCII 字符；若原始邮箱是张三@example.com，得先确保它实际可用（多数邮箱系统不支持中文 local-part），否则链接点了也发不出去 - URL 中的空格、中文、特殊符号要用
encodeURIComponent()处理，但href属性里不建议手写编码——直接用干净的 ASCII 写最省事、兼容性最好
移动端点击没反应？检查这几个地方
不是所有环境都默认支持 tel:/mailto:：iOS Safari 通常没问题，但微信内置浏览器、部分安卓 WebView 或禁用外部协议的 App 会静默忽略。别以为加了 href 就万事大吉。
- 微信里点
tel:链接，需开启「在网页中打开拨号」权限（iOS 微信默认关，安卓部分版本压根不支持）；可加提示文字：@#@#@#@#@#@#@#@#@#@2 - 邮件链接在 Outlook 桌面版可能弹窗报错，因它不严格遵循 mailto 规范；避免在
subject或body中使用换行符（%0A）或双引号，容易崩 - 不要给这些链接加
target="_blank"——mailto:在新标签页打开会导致空白页，tel:则完全失效
要不要加图标或 CSS 样式？
可以加，但别为了美观牺牲功能。图标用 或字体图标都行，重点是保证 标签包裹完整、href 值有效。
例如这个简洁写法：
<a href="tel:+8613800138000" style="text-decoration:none; color:#333;"> <svg width="16" height="16"><use href="#icon-phone"></use></svg> 138-0013-8000 </a>
注意：SVG 图标本身不能响应点击，必须整个 是可点击区域；另外，别用 pointer-events: none 或 opacity: 0 遮盖链接，移动端触摸热区会失效。
最易被忽略的一点：本地预览 HTML 文件（file:// 协议）时，部分浏览器（尤其是 Chrome）会禁用 tel: 和 mailto:，必须通过本地服务器（如 python3 -m http.server）打开才能测试真实行为。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
