老版IE（IE6–IE8）不支持Flexbox等现代CSS特性，需改用float、表格布局或图片降级等兼容方案，并注意hasLayout触发、EOT字体格式及console安全检测。
老版 IE（IE6–IE8）不识别 display: flex 怎么办
直接不用。IE8 及以下完全不支持 Flexbox，连 display: -ms-flexbox 这种私有前缀都无效——那是 IE10+ 才开始加的。真要兼容，得换布局思路。
常见替代方案：
- 用
float+overflow: hidden清浮动，或zoom: 1触发 hasLayout（IE6/7） - 表格布局：
display: table/table-cell在 IE8 中可用，但 IE7 及以下只认真实- 避免依赖
calc()、rgba()、border-radius等——它们在 IE8 及以下要么不支持，要么需 hack（如用 PNG 背景图模拟圆角）IE6–IE7 连
margin: 0 auto居中都不生效，咋调因为这些版本对块级元素的居中要求更严格：必须有明确宽度 + 触发 hasLayout。
典型修复写法：
立即学习“前端免费学习笔记（深入）”；
.container { width: 960px; margin: 0 auto; *zoom: 1; /* IE6/7 专用触发 hasLayout */ }注意点：
-
*zoom: 1是 IE6/7 的 hack，其他浏览器忽略；_width: 960px这类下划线 hack 已基本淘汰，优先用*zoom - 如果父容器是
position: relative且没设宽高，IE6 下margin: 0 auto可能失效，得补height: 1%或overflow: hidden -
绝对定位居中可走
left: 50%; margin-left: -480px（半宽负边距），但前提是宽度固定
IE8 不认
@font-face或图标字体咋处理IE8 支持
@font-face，但只认 EOT 格式，且语法必须严格：@font-face { font-family: 'MyIcon'; src: url('icon.eot'); src: url('icon.eot?#iefix') format('embedded-opentype'), url('icon.woff') format('woff'); }关键细节：
- 必须提供
.eot，且第一个src值不能带format()，否则 IE8 直接跳过 -
?#iefix是绕过 IE6–IE8 的 EOT 解析 bug，不是可选参数 - 图标字体建议搭配
font-smoothing: antialiased，但 IE8 不支持该属性，只能接受默认渲染 - 更稳方案：用雪碧图（CSS Sprite）+
background-position替代图标字体
用
console.log调试时 IE8 报错“对象不支持此属性或方法”因为 IE8 只有在开发者工具（F12）打开时才注入
window.console对象，关着就报错。安全写法是先检测再调用：
if (window.console && console.log) { console.log('debug info'); }或者更彻底地打桩：
if (!window.console) { window.console = { log: function() {}, error: function() {} }; }别省这一步——线上代码若残留未删的
console，在 IE8 关闭调试器时会直接中断 JS 执行。老版 IE 的样式问题，本质不是“加前缀就能好”，而是很多 CSS 特性它压根没实现。真正费时间的不是写 hack，是判断哪些视觉效果可以妥协、哪些必须降级为图片或 JS 补偿。越晚放弃 IE6–IE8，后期维护成本越高。
- 避免依赖
