Question

IE和FireFox设计存在不一致问题。

问题在于“li”渐变背景。根据需要，代码适用于Firefox，但不适用于IE。我将尝试通过代码解释我想要做的事情：

<li class="is-active">
    <ul>
        <li></li>
        <li class="is-active"></li>
        <li></li>
    </ul>
</li>

//For FireFox
li.is-active {
    background: -moz-linear-gradient(50% 0 , #E8E9E9, #FFFFFF 40px) repeat scroll 0 0 transparent;
    border-bottom: 1px solid #E0E0E0;
}
li li.is-active {
    background: none repeat scroll 0 0 transparent;
    border-bottom: 0 none;
}

//For Internet Explorer
li.is-active {
    filter progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#e8e9e9', endColorstr='#ffffff'); BACKGROUND-COLOR: #fff; _zoom: 1;
    border-bottom: #e0e0e0 1px solid;
}
li li.is-active {
    background: none transparent scroll repeat 0% 0%;
    border-bottom: 0px;
}

在这里，li li.is-active for IE无效。而不是li li.is-active，li.is-active也会在它上面实现。

这不是所希望的。

我希望我能够解释我的问题。

如果有任何建议可以帮助我解决此问题，请告知我们。

提前谢谢你。

Zeeshan

Answer 1

我为你创建了一个JS小提琴。看看和玩。 http://jsfiddle.net/Bf4CV/7/

Answer 2

尝试这个

li li.is-active {
    background: none transparent scroll repeat 0% 0%;
    filter: none;
    border-bottom: 0px;
}

希望它能解决您的问题

嵌套的li样式不适用于IE。

2 个答案: