知识库
精简漂亮的导航浮动菜单显示特效
代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<title>精简漂亮的导航浮动菜单显示特效演示 by js.alixixi.com</title>
<style>
ul,li{ margin:0px; padding:0px; list-style:none;}
.div_a{ width:300px; float:left;}
.div_a li{ width:300px; height:50px; border-bottom:1px solid #fff; cursor:pointer; background-color:#060; text-align:center; line-height:50px; font-size:18px; color:#fff;}
.div_a1{ width:300px; height:150px; position:relative; background-color:#F00; top:-50px; left:250px; z-index:999; display:none;}
.div_a li:hover .div_a1{ display:block;}
</style>
</head>
<body>
<div class="div_a">
<ul>
<li>这是内容这是内容
<div class="div_a1">这是里面的内容这是里面的内容这是里面的内容</div>
</li>
<li>这是内容这是内容
<div class="div_a1">这是里面的内容这是里面的内容这是里面的内容</div>
</li>
<li>这是内容这是内容
<div class="div_a1">这是里面的内容这是里面的内容这是里面的内容</div>
</li>
<li>这是内容这是内容
<div class="div_a1">这是里面的内容这是里面的内容这是里面的内容</div>
</li>
<li>这是内容这是内容
<div class="div_a1">这是里面的内容这是里面的内容这是里面的内容</div>
</li>
<li>这是内容这是内容
<div class="div_a1">这是里面的内容这是里面的内容这是里面的内容</div>
</li>
</ul>
</div>
</body>
</html>
-
·上一条：禁止移动搜索对网页转码的方法
·下一条：ASP查询数据库中上一周的所有记录代码
