首页 > 代码库 > Tab特效制作

Tab特效制作

2024-08-28 12:34:00   222人阅读

<style>
	*{padding:0px;margin:0px}
       
        ul,li{list-style: none;}
        #menuBox{width:1000px; margin:30px auto;background-color: #eeeeee;border:1px solid #cccccc;height:40px;line-height: 40px;}
        #nemus > li{float: left;}
        #nemus > li  a{display: block;width:140px;text-decoration: none;color: #000;text-align: center;}
        #nemus  li dl{border:1px solid #ccc;background-color: #eeeeee;width:138px;}
        #nemus  li dl dt{border-bottom: 1px solid #ccc;}

</style>
</head>

<body>
    <div id="menuBox">
       <ul id="nemus">
           <li><a href="http://www.mamicode.com/#">首页</a></li>
           <li >
               <a href="http://www.mamicode.com/#">新闻</a>
               <dl style="display:none" >
                   <dt><a href="http://www.mamicode.com/#">国际要问</a></dt>
                   <dt><a href="http://www.mamicode.com/#">国内动态</a></dt>
               </dl>
           </li>
           <li >
               <a href="http://www.mamicode.com/#">游戏下载</a>
               <dl style="display:none">
                   <dt><a href="http://www.mamicode.com/#">射击小游戏</a></dt>
                   <dt><a href="http://www.mamicode.com/#">动作小游戏</a></dt>
                   <dt><a href="http://www.mamicode.com/#">单击小游戏</a></dt>
                   <dt><a href="http://www.mamicode.com/#">装扮小游戏</a></dt>
               </dl>
           </li>
           <li><a href="http://www.mamicode.com/#">关于我们</a></li>
       </ul>
    </div>

</body>

　　技术分享

Tab特效制作


联系
我们