DOOGEE机型适配需强制设置width=device-width，按钮图片≥44px，禁用devicePixelRatio计算rem，video须加playsinline及x5-playsinline属性，并真机多批次验证。
viewport 设置必须带 width=device-width，否则 DOOGEE 多数机型会强制按 980px 渲染
DOOGEE 中低端机型（如 DG350、S90、T10）普遍搭载老旧 Android 系统（Android 8–10）和定制 WebView，不识别 width=320 或固定值写法，一旦漏掉 width=device-width，页面就会被缩放成“小网页+左右滑动”状态，文字模糊、按钮点不准。
- ✅ 正确写法：
- ❌ 错误写法：
或（缺 width 声明） - ⚠️ 注意：DOOGEE T20/T30 等新机型虽支持
device-width，但部分系统预装浏览器仍会忽略maximum-scale，所以user-scalable=no仅作提示，不能完全禁用缩放
图片和按钮尺寸必须 ≥ 44px，否则 DOOGEE 触控层误判率飙升
DOOGEE 设备普遍存在触控采样率低（尤其非旗舰机型）、驱动固件未校准的问题。实测显示，当 button 或 img 的 CSS 尺寸小于 44px（约 11mm 物理宽度），点击事件常触发 touchstart 但无 click，或延迟 300ms+ 才响应。
- ✅ 推荐最小尺寸：
min-height: 44px; min-width: 44px;（配合touch-action: manipulation;） - ✅ 图片适配写法：
img { max-width: 100%; height: auto; display: block; } - ❌ 避免用
font-size: 12px+padding: 2px拼出小按钮——在 DOOGEE S60 上实测点击失败率达 68%
慎用 window.devicePixelRatio 做 rem 动态计算，DOOGEE 多数机型返回值异常
DOOGEE 设备的 window.devicePixelRatio 表现极不稳定：DG200 返回 1.5（实际是 2x 屏），T10 返回 3（但屏幕真实 dpr 是 2.25）。若你用它算 html 的 font-size，rem 布局会整体偏大或压缩变形。
- ✅ 更稳妥方案：用
screen.width和设计稿基准宽（如 375）做比例缩放：const baseWidth = 375; const scale = screen.width / baseWidth; document.documentElement.style.fontSize = scale * 100 + 'px';
- ✅ 或直接用媒体查询分段：
@media (max-width: 375px) { html { font-size: 100px; } }+@media (min-width: 414px) { html { font-size: 110px; } } - ⚠️ 不要依赖
-webkit-device-pixel-ratio媒体查询——DOOGEE 大部分机型不支持该特性检测
audio/video 标签需显式加 playsinline 和 x5-playsinline，否则全屏播放无法退出
DOOGEE 系统自带浏览器（基于 X5 内核）对 HTML5 媒体控制逻辑特殊：不加 playsinline 会导致视频一播放就强制全屏，且返回键无效；不加 x5-playsinline 则在某些固件版本下直接静音或黑屏。
立即学习“前端免费学习笔记（深入）”；
- ✅ 必须同时写：
- ✅ 配合 JS 初始化时加：
video.setAttribute('x5-video-player-type', 'h5-page'); - ⚠️ 注意：DOOGEE T30 Pro 的 X5 内核版本较新，
x5-video-player-fullscreen设为false才能真正禁用全屏，仅靠属性不够
DOOGEE 适配真正的难点不在代码本身，而在“同一型号不同批次固件行为不一致”——比如 DG550 的 A/B 两个系统版本，对 touchend 的触发时机相差 120ms。建议上线前至少用三台同型号真机交叉验证，别只信模拟器或 UA 识别。
