下拉菜单

 

<style>
#fx{ margin:0 auto; background:#ccc; width:200px; text-align:center;}
#menu{ margin:0 auto; background:#fcfcfc; width:200px; text-align:center;}
</style>

 

<div id="fx" onMouseOver="showlist()" onMouseOut="hidelist()">分类</div>

<div id="menu" style="display: none;" onMouseOver="showlist()" onMouseOut="hidelist()">
<div class="f">家电</div>
<div class="f">数码</div>
<div class="f">手机</div>
<div class="f">衣服</div>
</div>

 

<script type="text/javascript">
function showlist()
{
document.getElementById("menu").style.display="block";
}

function hidelist()
{
document.getElementById("menu").style.display="none";
}
</script>