HTML条件注释仅IE5–IE9支持，IE10+及所有现代浏览器已彻底移除，既不执行也不报错；现代应使用特性检测（如CSS.supports()、API存在性判断）替代UA或条件注释。
HTML条件注释不能做浏览器特性检测——它早已失效，且只针对旧版IE的渲染分支，和“特性”无关。
为什么<!--[if IE]>现在完全没用
IE10+ 及所有现代浏览器（Chrome、Firefox、Safari、Edge）已彻底移除对条件注释的支持。写<!--[if IE 11]>或<!--[if !IE]>，浏览器会把它当普通注释忽略，既不执行也不报错。更麻烦的是：某些构建工具或 HTML 压缩器会直接删掉这些注释，导致你本想保留的降级代码也消失了。
- IE5–IE9 是唯一支持范围；IE10 开始解析器就跳过整个
<!--[if ...]>语法 -
<!--[if gte IE 8]>这类写法在 IE10+ 中返回false，但不是因为“判断失败”，而是因为压根没识别这个语法 - 用条件注释加载 polyfill（比如
<script src="ie9-polyfill.js"></script>）在现代项目里等于白写——脚本根本不会执行
CSS.supports()才是真正的CSS特性检测
要检测浏览器是否支持aspect-ratio、container-type或backdrop-filter，必须用 CSSOM 接口：CSS.supports()。它返回true或false，且是运行时真实能力反馈。
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
- 正确写法：
CSS.supports('aspect-ratio', '1/1')或CSS.supports('inset: 10px')（单参数支持逻辑属性） - 漏引号就失效：
CSS.supports(display, grid)❌，CSS.supports('display', 'grid')✅ - 注意边界：Chrome 110 支持
@container语法但渲染异常，CSS.supports('container-type', 'size')可能返回true，但实际布局错乱——得加视觉 fallback
JS里检测API存在性别碰navigator.userAgent
查'fetch' in window比查navigator.userAgent.includes('Chrome')可靠十倍。UA 字符串不可控、可伪造、版本和能力严重脱钩（比如 Safari 16.3 声称支持dialog，但close()事件不触发）。
立即学习“前端免费学习笔记（深入）”；
- 全局 API：
'fetch' in window、'onbeforeinstallprompt' in window - 构造函数：
typeof Promise === 'function'（'Promise' in window在 IE11 中为true但值是undefined） - HTML 元素行为：
'showModal' in document.createElement('dialog')（比typeof HTMLDialogElement !== 'undefined'更能暴露“半支持”） - 属性支持：
const el = document.createElement('div'); el.inert = true; 'inert' in el（必须设在实例上）
真正要兼容老环境时，组合策略比单点依赖更稳
特征检测的麻烦不在语法，而在那些“看起来有、用起来崩”的情况：API 存在但抛错、CSS.supports 返回true但渲染错位、事件注册了却不触发。每次加检测前，先在目标浏览器控制台里console.log看一眼原型链和返回值，比查 caniuse 更快。
- 不要只靠
CSS.supports()就认为样式安全，搭配 class fallback（如.supports-aspect-ratio）更可控 - JS 检测后，务必加
try/catch——ResizeObserver在旧 Safari 中存在但调用observe()直接 throw - 服务端 UA 判断只适合统计或灰度提示，功能开关必须由客户端运行时决定
