Question

我必须修改HTML页面，因为该菜单不适用于IE6 / IE7 / IE8。

HTML code：

<div id="menu">
    <table>
    <tr>
        <td><a href="menu1.php">Menu 1</a></td>

        <td>Menu 2
                <ul>
                    <li><a href="submenu1-1.php">Sub-menu 1</a></li>
                    <li><a href="submenu1-2.php">Sub-menu 2</a></li>
                    <li><a href="submenu1-3.php">Sub-menu 3</a></li>
                </ul>
        </td>

        <td><a href="menu3.php">Menu 3</a></td>

        <td>Menu 4
            <ul>
                    <li><a href="submenu3-1.php">Sub-menu 1</a></li>
                    <li><a href="submenu3-2.php">Sub-menu 2</a></li>
                    <li><a href="submenu3-3.php">Sub-menu 3</a></li>
            </ul>
        </td>

        <td><a href="menu5.php">Menu 5</a></td>

        <td>Menu 6
                <ul>
                    <li><a href="submenu5-1.php">Sub-menu 1</a></li>
                    <li><a href="submenu5-2.php">Sub-menu 2</a></li>
                    <li><a href="submenu5-3.php">Sub-menu 3</a></li>
                </ul>
        </td>

        <td><a href="disconnect.php">Menu 7</a></td>

    </tr>
    </table>
</div>

CSS代码：

#menu a, #menu li, #menu td{
    color: black;
    text-decoration: none;
}

#menu a:hover{
    color: black;
}

#menu ul {
    list-style-type: square; 
    text-align:left;
}

#menu table{
    width: 100%;
    height:40px;
}

#menu td{
    border-right: 2px solid black; 
    padding-right:5px;
}

#menu td ul{
    position:absolute;
    left: -999em;
    margin-top:0px;
    border: 2px outset black;
    background: white;
}

#menu td:hover ul{

    left: auto;
}

'td'和'ul'的语法对我来说有点奇怪。是否有任何提示可以恢复与旧版Microsoft浏览器的兼容性？

谢谢！

Answer 1

如果您的页面处于标准模式，

#menu td:hover ul将在IE7 +中运行。

要使您的页面使用标准模式，请添加适当的doctype作为第一行，例如：

<!DOCTYPE html>

不幸的是，这不会修复IE6，因为该版本仅支持:hover元素上的a。

要修复IE6（以及IE的其他版本，如果无法添加文档类型且页面必须保持Quirks模式），则应使用此JavaScript修复程序：

http://peterned.home.xs4all.nl/csshover.html

大多数现代浏览器支持   ：任何html元素的悬停选择器。   这很酷，因为它可以让你   例如，应用鼠标悬停   仅使用对表行的效果   CSS。然而，IE有一个不稳定的   支持：最好悬停，取决于   在特定版本上您的访问者   正在使用。

无论如何：悬停是一个小脚本   自动补丁：悬停，：活跃   并且：专注于 IE6，IE7和IE8   怪癖，让你像你一样使用它们   会在任何其他浏览器中。

菜单列表与IE6 / IE7兼容

1 个答案: