导航浮动菜单显示代码,Css代码库,德仔网

代码语言

代码分类

【Css】导航浮动菜单显示

作者: / 发布于2016/4/26/ 780

<!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>

试试其它关键字

　导航浮动菜单显示　

同语言下

可能有用的

贡献的其它代码Label