10 09/2014

css 背景透明

最后更新: Wed Sep 10 2014 12:29:11 GMT+0800

opacity 继承，所以内部文字等也会透明。如果只是需要 背景透明 的话，应该这样

.opacity {background:rgba(0, 0, 0, 0.3);}
filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#4c000000', EndColorStr='#4c000000');
\* StartColorStr 和 EndColorStr:
\* #4c000000 是 30% 透明度的 #000000 的意思
\* 组成: # + 透明度 + 颜色
\* 算法: Math.floor(0.6 * 255).toString(16);

ie9 两个都支持，所以有问题，需要 hack 一下

:root .opacity{
  filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#00000000', EndColorStr='#00000000');
}

原文来自 背景半透明最佳实践