Question

我遇到IE无法渲染的问题：悬停效果。这是我的CSS

#navlist li:hover {
    color: white;
    cursor: pointer;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    padding-top: 6px;
    padding-bottom: 6px;
    background-image: -moz-linear-gradient(top, #ffa23e, #e1841f);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #ffa23e), color-stop(1.0, #e1841f));
}

我在网上发现一些IE忽略的东西：悬停在锚标签上。在任何情况下，有没有人知道正确的解决方法？

另外，我使用的是HTML5 doctype - 这会导致问题吗？

Answer 1

-moz-linear-gradient和-webkit-gradient在IE中不起作用。完全没有。 CSS gradient generator救援。

Answer 2

鉴于您已使用doctype并且代码中没有其他错误，我假设您使用的是IE6。每个更高版本都支持悬停在所有元素上。在IE6上悬停工作有两种可能性。

onmouseover和onmouseout的javascript。
使用旧的hover.htc，如果您仍然可以在某处下载并集成行为。

body { behavior:url("csshover.htc"); }

Answer 3

请参阅与您的代码相关的IE评论。

#navlist li:hover { /*hover not for IE6 or under on li elements*/
    color: white;
    cursor: pointer;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px; /*only works in IE9+ */
    padding-top: 6px;
    padding-bottom: 6px;
    background-image: -moz-linear-gradient(top, #ffa23e, #e1841f); /*not IE*/
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #ffa23e), color-stop(1.0, #e1841f)); /*not IE*/
}

li：在资源管理器中悬停问题

3 个答案: