一般网站导航都使用jquery特效居多，但是利用纯css样式也可以打造一个简单的导航效果，不支持IE6这里可以用jquery弥补。
[code]<style>
*{ margin:0; padding:0;}
li{ list-style-type:none; height:16px;}
div li:hover,div:hover{ background:yellow; position:relative}
div.a{position:relative}
div.a ul{ position:absolute;top:100%;*top:16px; left:0; visibility:hidden}
div.a:hover > ul{visibility:visible}
div.a > ul li:hover > ul{visibility:visible}
div.a > ul >li{ position:relative;}
div.a ul ul{position:absolute;visibility:hidden; left:100%; top:0;}
</style>[/code]
[code]<div class=”a”>
asdasdf
<ul>
<li><a href=”#”>12312312</a></li>
<li><a href=”#”>12312312</a></li>
<li><a href=”#”>12312312</a></li>
<li><a href=”#”>12312312</a>
<ul>
<li><a href=”#”>12312312</a></li>
<li><a href=”#”>12312312</a></li>
<li><a href=”#”>12312312</a></li>
<li><a href=”#”>12312312</a></li>
</ul>
</li>
</ul>
</div>[/code]