纯CSS弹出菜单（不支持IE6.0以下）

最新推荐文章于 2024-07-18 13:52:01 发布

weixin_33802505

最新推荐文章于 2024-07-18 13:52:01 发布

阅读量63

点赞数

文章标签： xhtml

原文链接：http://www.cnblogs.com/mane/p/3306960.html

版权

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <style type="text/css">
        #menu li {
            width: 80px;
            height: 30px;
            float: left;
            list-style-type: none;
            background-color: #CCCCCC;
            border: 1px solid #666666;
        }

        #menu a{
            display: block;
            width: 100%;
            height: 100%;
        }

        #menu ul li ul {
            display:none; 
        }
     
        #menu ul li:hover ul{
            display:block; 
            position: relative;
            z-index:1;
            top: 2px;
            left: -41px;
        }
    </style>
</head>
<body>
    <div id="menu">
        <ul>
            <li><a>菜单项</a></li>
            <li><a>菜单项</a></li>
            <li>
                <a>菜单项</a>
                <ul>
                    <li><a>子菜单项</a></li>
                    <li><a>子菜单项</a></li>
                </ul>
            </li>
        </ul>
        <h1>11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111</h1>
    </div>
</body>
</html>

转载于:https://www.cnblogs.com/mane/p/3306960.html

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

weixin_33802505

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
纯CSS弹出菜单（不支持IE6.0以下）

<!DOCTYPE html><html lang="en" xmlns="http://www.w3.org/1999/xhtml"><head> <meta charset="utf-8" /> <title></title> <style type="text/css"...
复制链接

扫一扫