应针对各浏览器差异分别处理：Chrome/Edge支持原生date控件，Safari/iOS需降级JS日历库；旧Android WebView需双写flex声明；iOS 15.4前fetch超时需手动实现；微信X5内核需动态注入CSS变量。
不同浏览器对
原生日期控件在 Chrome、Edge 上显示为下拉日历，Safari 仅显示文本框，iOS WebView 甚至不触发任何交互。这不是 bug，是规范允许的“用户代理自由实现”。
- 用
Modernizr.inputtypes.date或typeof document.createElement('input').type === 'string'检测是否原生支持 - 不支持时，必须 fallback 到 JavaScript 日历库（如
flatpickr或dayjs + 自定义 UI），不能只靠 CSS 修饰原生控件 - 注意 iOS Safari 的
inputmode="numeric"对日期无效，别加 - 提交前用
input.checkValidity()验证，避免 Safari 返回空字符串却通过表单校验
flex 布局在旧版 Android WebView 中错位怎么修
Android 4.4–5.1 的 WebView 使用的是已废弃的 display: -webkit-flex 语法，且 flex-wrap、align-content 行为与现代标准不一致。
- 必须同时写两套声明：
display: flex和display: -webkit-flex -
flex: 1在旧 WebView 中可能失效，改用flex: 1 1 auto并显式设min-width: 0防止溢出 - 避免依赖
align-content: center，旧引擎不识别，改用justify-content+ 包裹容器 - 用
Can I use flexbox查具体属性兼容性，别只看“flex”大类
fetch() 在 iOS 15.4 之前不支持 AbortSignal.timeout() 怎么兼容
iOS 15.4 才开始支持 AbortSignal.timeout(5000)，此前版本调用直接报 TypeError: AbortSignal.timeout is not a function。
- 不要直接调用
AbortSignal.timeout()，先检测：typeof AbortSignal.timeout === 'function' - 不支持时，用
setTimeout+controller.abort()手动实现超时控制 - 注意：iOS 14–15.3 的
fetch本身不支持signal参数？错，它支持 signal，只是不支持 timeout 工厂函数 - 超时后记得清理定时器，防止内存泄漏
CSS 变量在微信内置浏览器（X5 内核）里失效咋办
微信安卓版长期使用 X5 内核（基于旧版 Blink），CSS 自定义属性（--main-color）默认不启用，即使写了 :root { --c: red } 也无效果。
立即学习“前端免费学习笔记（深入）”；
- 必须开启实验性功能：
document.documentElement.style.setProperty('--c', 'red')动态注入，静态声明会被忽略 - 变量名避免用连字符开头（如
--_size），X5 解析不稳定 - 慎用
var(--c, blue)回退值，X5 对回退语法支持不完整，建议 JS 检测后降级为内联 style - 构建时用 PostCSS 插件（如
postcss-custom-properties）静态替换，比运行时更可靠
console.log，而不是靠文档猜。 
