底部悬浮条用 position: fixed + bottom: 0 实现最稳妥，需设 width: 100%、z-index ≥ 999，并为 body 添加 padding-bottom；拨号链接必须用标准 tel: 协议（如 tel:+8613800138000），禁用空格、标点；点击区域不小于 44px × 44px；微信安卓可能拦截，需加复制提示 fallback；多语言站点须真机测试目标地区号码格式。
底部固定悬浮条用 position: fixed 实现最稳妥
直接用 position: fixed + bottom + left/right 定位，比 sticky 兼容性好、行为确定。iOS Safari 和老版 Android WebView 对 sticky 支持不一，容易错位或失效。
关键点：
-
bottom: 0必须配合width: 100%或明确宽度，否则可能只占内容宽 - 加
z-index: 999（或更高）避免被其他元素遮挡，尤其有轮播图、弹窗时 - 别忘了加
padding-bottom到，防止页面内容被条挡住（高度至少等于条高）
拨号链接必须用 tel: 协议，且号码不能带空格或中文标点
浏览器识别拨号只认标准 tel: URI Scheme。任何多余字符（如 + 后没空格、括号、短横线）都可能导致 iOS 不触发拨号，Android 部分机型直接忽略。
正确写法示例：
<a href="tel:+8613800138000">立即拨打</a>
常见错误：
-
tel:138-0013-8000→ 短横线会被当分隔符，iOS 拒绝调起电话 -
tel：+86 138 0013 8000→ 中文冒号、空格全都不合法 -
javascript:void(0)绑 click 调原生 API → 浏览器禁止非用户手势触发拨号，白忙活
点击区域要够大，iOS 上至少 44px 高才不容易误触
iOS 的可点击区域最小建议是 44px × 44px，否则手指点不准，尤其悬浮条紧贴屏幕底边时。
实操建议：
- 给
<a></a>设置display: block+min-height: 44px，内部文字垂直居中 - 左右留足内边距，比如
padding: 0 16px，避免文字顶到边缘 - 如果条里还有图标，确保整个容器响应点击，别只让文字可点
部分安卓微信内置浏览器会拦截 tel:，需加提示 fallback
微信 Android 版（尤其旧版本）默认禁用 tel:，点下去没反应，用户以为功能坏了。
简单 fallback 方案：
- 在按钮旁加小字提示：
长按复制号码：13800138000 - 或者用
onclick监听，捕获失败后提示：“如未自动拨号，请手动复制号码拨打” - 不推荐用
navigator.userAgent做微信判断——规则常变，维护成本高；直接视觉提示更可靠
真正麻烦的是多语言站点：不同地区号码格式差异大，+86、0086、86 在不同系统解析结果不同。上线前务必用真机测目标地区常用机型。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
