Html 半透明渐变图像变暗而不去饱和

我正在设计一个网站，将有多个嵌套的div为侧菜单。每个div的背景都是比其周围div更深的蓝色阴影

我希望每个div在背景中都有渐变效果，从稍微深一点的蓝色到div的背景色

我知道CSS3内置了对渐变的支持，但较旧的浏览器无法显示渐变，所以这不是一个选项。相反，我一直在做的是为每个div创建一个PNG背景

然而，这个PNG背景选项不是超级可持续的。如果我决定我想要一个稍微不同的颜色作为背景，我必须用这个新颜色创建一个新的PNG。讨厌

我希望我可以在所有div中使用一个半透明的灰色到透明的PNG图像，这样我就可以自由地更改背景颜色。但是使用这种PNG的问题是它会去饱和、去光泽而不是变暗

有没有办法操纵这样一个PNG，使它覆盖的任何东西变暗而不去饱和？？

好了：

your-element{
  background-color: #444444;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#999999));
  background-image: -webkit-linear-gradient(top, #444444, #999999);
  background-image:    -moz-linear-gradient(top, #444444, #999999);
  background-image:     -ms-linear-gradient(top, #444444, #999999);
  background-image:      -o-linear-gradient(top, #444444, #999999);
  background-image:         linear-gradient(to bottom, #444444, #999999);
}

你的IE规则是：

your-element{
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#99B4B490,endColorstr=#99B4B490);
        zoom: 1;
}

---

Easy peasy跨浏览器兼容，例如99%的浏览器。

也适用于背景图像，不过您需要使用css3多背景选项