Tab特效制作
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了Tab特效制作相关的知识，希望对你有一定的参考价值。
<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="#">首页</a></li>
<li >
<a href="#">新闻</a>
<dl style="display:none" >
<dt><a href="#">国际要问</a></dt>
<dt><a href="#">国内动态</a></dt>
</dl>
</li>
<li >
<a href="#">游戏下载</a>
<dl style="display:none">
<dt><a href="#">射击小游戏</a></dt>
<dt><a href="#">动作小游戏</a></dt>
<dt><a href="#">单击小游戏</a></dt>
<dt><a href="#">装扮小游戏</a></dt>
</dl>
</li>
<li><a href="#">关于我们</a></li>
</ul>
</div>
</body>
以上是关于Tab特效制作的主要内容，如果未能解决你的问题，请参考以下文章
使用jQuery快速高效制作网页交互特效——07 第七章 jQuery中的事件与动画
特效Tab --- 标题切换 SmartTabLayoutMagicIndicator