IE8不支持HTML5标签和部分JS API，需用html5shiv注册标签并降级使用DOM方法和类操作。
IE8根本不认识<header>这类HTML5标签
它会把<section>、<nav>等当普通内联元素渲染，结果就是样式全乱——比如没设置display: block，文字就挤成一行。这不是CSS写错了，是IE8压根不识别这些标签名。
- 必须在
<head>里用条件注释加载html5shiv.js：<!--[if lt IE 9]> <script src="html5shiv.min.js"></script> <![endif]-->
-
html5shiv本质是调用document.createElement('article')让IE8“记住”这些标签，否则连getElementById都找不到它们 - 别用
innerHTML动态插入HTML5标签——js执行时IE8还没通过shim注册，照样失效
querySelector和classList在IE8里直接报错
写document.querySelector('.btn')？IE8控制台立刻弹Object doesn't support property or method 'querySelector'。这不是语法错误，是API根本不存在。
- 降级方案：用
document.getElementById代替querySelector('#id')；用document.getElementsByTagName或getElementsByClassName（需配合html5shiv）代替类选择器 -
element.classList.add('active')得拆成element.className += ' active'，注意开头加空格，否则变成'activeactive' - 别依赖
Array.prototype.forEach——IE8数组方法极简，循环老实用for(var i = 0; i
X-UA-Compatible不是万能钥匙，放错位置就失效
写了<meta http-equiv="X-UA-Compatible" content="IE=edge">却还是进IE7模式？大概率是它没坐在<head>最前面——前面哪怕多一个空格、一条注释，IE都会忽略它。
- 必须紧贴
<head>开头，在所有其他<meta>、<title>之前 - 服务器返回的
X-UA-Compatible响应头优先级更高，如果Nginx或Express里配了res.setHeader('X-UA-Compatible', 'IE=5')，HTML里的meta完全白写 - 用户手动把你的域名加进IE“兼容性视图设置”列表，这个meta也拦不住——得靠后端HTTP头统一管控，或引导用户关闭该设置
视频、弹窗、Flex布局这些“现代功能”得换思路实现
IE8连<video>标签都不解析，更别说flex或opacity。硬塞polyfill容易翻车，不如按能力分层兜底。
立即学习“前端免费学习笔记（深入）”；
- 视频用
html5media.js：它检测到IE8就自动回退到Flash fallback，你只管写标准<video src="a.mp4"></video></li> <li>弹窗透明遮罩？IE8不支持<code>rgba()
和opacity，得用半透明PNG做遮罩层，或用filter: alpha(opacity=50)（仅IE专有） - Flex布局放弃吧——IE10+才勉强支持
-ms-flexbox，且行为差异大；改用float或inline-block，或者用@supports (display: flex)包裹新写法，旧浏览器自动跳过
真正麻烦的不是某一行代码怎么写，而是整个开发流程得倒过来：先确保纯HTML能在IE8里读得懂、看得清，再考虑加CSS，最后才动JS。漏掉任何一层，用户看到的就是空白页或满屏报错。
