在CSS中的下拉菜单在IE9中显示为透明

Question

在Google的两天内使用我的CSS并搞乱了我，放弃并转向你们寻求帮助。 我创建了一个完全在CSS中的下拉菜单。 当在IE9下测试这个时候，显然它不起作用。

下拉菜单显示为透明，我找不到为什么我的生活。所有在其他浏览器中运行正常，但我似乎无法找到IE不理解的属性。

我怀疑这部分：

nav ul ul li { 
    float: none; 
    border-bottom: 1px solid #b7b7b7; 
    border-top: 1px solid #fff; 
    position: relative; 
    background: -webkit-linear-gradient(#eeeeee 0%, #d4d4d4 100%); 
    background: linear-gradient(#eeeeee 0%, #d4d4d4 100%); 
    background: -moz-linear-gradient(#eeeeee 0%, #d4d4d4 100%); 
    background: -o-linear-gradient(#eeeeee 0%, #d4d4d4 100%); 
    -moz-box-shadow: inset 2px 2px 5px #ccc; 
    -webkit-box-shadow: inset 2px 2px 5px #ccc; 
    box-shadow: inset 2px 2px 5px #ccc; 
} 

有没有可能是IE没有看到背景？我在这里附上小提琴：http://jsfiddle.net/VU37g/

对CSS的任何帮助或意见，欢迎提前致谢！

Answer 1

由于IE 9不支持渐变，您必须使用专有的MS滤镜属性才能达到类似的效果。如果未指定背景颜色的值，则默认情况下将其设置为transparent。

语法IE会是这样：

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc', endColorstr='#000000'); 

More info

Answer 2

为了让跨浏览器兼容，请遵守本指南

对于IE只有：

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc', endColorstr='#000000'); 

http://webdesignerwall.com/tutorials/cross-browser-css-gradient