旧版ie（ie6–ie8）不支持opacity，必须用filter:alpha(opacity=xx)降级，参数需大写、整数0–100、无空格换行；该滤镜使子元素一同变淡，若仅需背景半透应改用gradient滤镜模拟rgba。
旧版IE（IE6–IE8）根本不识别 opacity 属性，直接跳过整条声明——写了等于没写。必须用 filter: alpha(opacity=XX) 手动降级，且参数、写法、触发条件都有硬性限制。
filter: alpha(opacity=XX) 的参数和写法陷阱
IE6–IE8 只认 filter: alpha(opacity=70) 这种格式，不是小写 opacity，也不是带百分号或小数：
• opacity 参数名首字母必须大写，写成 opacity=70 或 Opacity=70 都无效，只能是 Opacity=70
• 值必须是 0–100 的整数，Opacity=70.5、Opacity=70%、Opacity=0.7 全部被忽略
• filter: 和 alpha(...) 之间不能换行、不能有空格，尤其 IE6–7 对格式极其敏感
• 多个滤镜共存时（比如加了 gradient），alpha 必须放在最后，否则会被覆盖
为什么子元素也变透明？这不是 bug，是设计如此
filter: alpha() 作用于整个渲染节点，和标准 opacity 一样会创建局部层叠上下文，并向下继承——文字、图片、子容器全部跟着变淡。
• 如果你只想让背景半透而文字不透明，alpha 不适用，得换方案：用 progid:DXImageTransform.Microsoft.gradient 模拟 rgba 背景（如 startColorStr=#80000000）
• 若坚持用 alpha，需把文字抽离到兄弟元素并用 position: relative; z-index: 2 提升层级，但要注意 IE 的 stacking context 规则更苛刻
• 行内元素（如 <span></span>）默认不生效，必须显式设 display: inline-block 或 zoom: 1 触发 hasLayout
和现代语法共存时的顺序与 fallback 策略
现代写法必须写在 filter: alpha() 后面，否则 IE 会解析失败或覆盖：
• 正确顺序：filter: alpha(Opacity=70); opacity: 0.7;
• 错误顺序：opacity: 0.7; filter: alpha(Opacity=70);（部分 IE7 下可能失效）
• Autoprefixer、PostCSS 默认不生成 alpha，需手动启用 ie-css3 插件或写死降级
• 不要依赖“浏览器自动 fallback”——IE8 遇到不认识的 opacity: 0.7 就直接丢弃，不会尝试找下一条；所以降级声明必须前置且独立存在
最易被忽略的一点：IE6–IE7 下，如果父容器没宽高、没浮动、也没触发 hasLayout，alpha 滤镜可能导致布局塌陷或定位偏移，建议统一加 zoom: 1 或 height: 1px 保底。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
