IE8及更早版本不支持rgba()，会直接丢弃整条声明；需先设十六进制兜底色，再写rgba()覆盖，并用gradient滤镜模拟透明（startColorstr=endColorstr，alpha按×255取整转十六进制），且filter会触发hasLayout影响布局。
IE8 及更早版本压根不解析 rgba()，不是写法错，是 CSS 解析器根本没实现这个函数。它会直接丢弃整条声明，背景变透明或回退到默认色——你看到的“没效果”，其实是被静默忽略了。
IE8 对 rgba() 的解析行为是彻底失效
现代浏览器把 rgba(0, 0, 0, 0.5) 当作一个完整颜色值；IE8 则把它当无效语法，连带后面的声明（比如 background-color）整个跳过。这不是“透明度不生效”，而是“整条规则不执行”。所以不能只靠加 filter 就完事，必须先确保有兜底色。
- 先写
background-color: #000000（十六进制纯黑），IE8 能认 - 再写
background-color: rgba(0, 0, 0, 0.5)，现代浏览器覆盖前一行 - 最后加
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f000000, endColorstr=#7f000000)，专供 IE8 渲染半透明
filter: progid:DXImageTransform.Microsoft.gradient 不是渐变，是借壳用
这个滤镜本意是做线性渐变，但 IE8 下没有其他原生 alpha 支持，只能拿它“冒充”单色透明。关键点在于：startColorstr 和 endColorstr 必须完全相同，否则会出现意外色带。
-
#7f000000中的7f是透明度（对应0.5 * 255 = 127→ 十六进制7F） -
000000是 RGB 颜色部分，必须跟你要的rgb()值一致（比如rgb(255,255,255)→#FFFFFF） - 别混用
filter: alpha(opacity=50)和gradient，两者叠加会导致颜色异常甚至全黑
透明度换算不能靠心算，得按公式来
rgba(…, a) 的 a 是小数，IE filter 要的是 alpha × 255 后截断取整再转十六进制（不四舍五入）。比如 a = 0.33 → 0.33 × 255 = 84.15 → 取整得 84 → 十六进制是 54，最终颜色串为 #54000000。
立即学习“前端免费学习笔记（深入）”；
- 常见值可查表，但动态生成时必须代码计算，不能硬编码
4C当0.3 - 十六进制部分必须是 6 位，不足补零（如
rgb(51, 102, 153)→#336699，不是#369） -
startColorstr和endColorstr字母大小写要统一（推荐全大写），IE8 对大小写敏感
真正容易被忽略的是：IE8 的 filter 会强制触发 hasLayout，可能影响元素盒模型（比如莫名多出边距、高度塌陷）。如果用了 position: fixed 或绝对定位遮罩层，务必在 IE8 下实测滚动行为——很多“背景不随滚动”的问题，根源就在这儿。
