根本原因是ie8–ie10缺失html5标签识别、媒体查询支持和现代盒模型解析能力；必须配合html5shiv（置于head最顶部）、respond.js（同域加载）、ie=edge meta（head首个标签）及-ms-前缀等综合方案。
Bootstrap导航栏在IE浏览器（尤其是IE8–IE10）不显示或错位，根本不是CSS写得不对，而是浏览器压根没解析出
IE8下导航栏直接塌成手机折叠态
现象是：桌面宽屏下也只显示“Toggle navigation”按钮，点开后下拉菜单遮挡内容、定位飘移、点击无响应。这不是bug，是IE8根本不认识<nav></nav>、<button></button>等语义化标签，且完全忽略Bootstrap的媒体查询断点。
-
html5shiv.min.js必须放在最顶部，在<title></title>之前，否则IE8跳过后续所有HTML5标签 -
respond.min.js必须与Bootstrap CSS同域加载；用CDN（如jsdelivr）时，若页面本身是file://或非HTTP协议，它会静默失效 - 本地双击HTML文件调试？不行。必须走
http://localhost类Web Server（如Live Server、Nginx），否则respond.js拒绝工作 - JQuery版本锁死在
1.12.4；2.x+在IE8里删掉了关键的事件委托逻辑，导致data-toggle="collapse"完全不触发
IE9–IE10下下拉菜单悬空或点击失灵
IE9能识别<nav></nav>但不支持transform和transition，IE10对box-sizing: border-box计算有偏差，导致.dropdown-menu定位偏移、.navbar-collapse宽度溢出。
- 给关键交互容器加
-ms-前缀：.dropdown-menu { -ms-transform: translateZ(0); } - 重置所有栅格盒模型：
.container, .row, .col-xs-*, .col-sm-* { -ms-box-sizing: border-box; box-sizing: border-box; } - 禁用
Affix、Scrollspy等依赖IntersectionObserver的JS组件；改用window.onscroll+getBoundingClientRect()手动判断位置 - 不要靠
data-toggle自动初始化Dropdown；显式调用$('...').dropdown()，确保IE环境执行路径可控
IE兼容性视图让一切努力白费
哪怕polyfill全装好，只要IE进入“兼容性视图”，文档模式回落到IE7 Quirks，浮动布局、inline-block、甚至float: right都会彻底失效——这不是代码问题，是IE主动降级引擎。
-
<meta http-equiv="X-UA-Compatible" content="IE=edge">必须是中第一个标签（<title></title>之前），晚一毫秒就无效 - 绝对不要写
content="IE=9"或content="IE=10"，这会锁死内核，反而阻止Edge模式启用 - F12开发者工具里检查“文档模式”是否真为
Edge；若显示7或8，需手动从IE设置中清除当前域名的兼容性视图列表 - 国产浏览器（如360、QQ）默认走IE内核，加
<meta name="renderer" content="webkit">强制切高速模式
真正卡住人的地方从来不是“要不要加html5shiv”，而是respond.js在跨域或file://下静默失败、IE=edge meta被<title></title>挡住、JQuery版本混用导致事件监听器根本没绑上——这些细节不逐条验证，光堆代码没用。
