<!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" />
<title></title>
<style type="text/css">
body { font:12px/25px 宋体; color:#333; background:#d4e8f3; }
ul,li { margin:0; padding:0; }
ul { list-style:none; }
ul li { float:left; position:relative; }
ul li a { display:block; width:80px; color:#fff; padding:0 10px; text-decoration:none; }
ul li a:link,ul li a:visited { background:#639c31; }
ul li a:hover,ul li a:active { background:#ff9c00; }
ul ul { position:absolute; left:0; top:25px; display:none; background:#fff; }
ul ul li { float:none; margin-top:1px; }
</style>
<script type="text/javascript">
function showMenu(obj)
{
obj.getElementsByTagName("ul")[0].style.display = "block";
}
function hideMenu(obj)
{
obj.getElementsByTagName("ul")[0].style.display = "none";
}
</script>
</head>
<body>
<div id="navbar">
<ul>
<li οnmοuseοver="showMenu(this)" οnmοuseοut="hideMenu(this)">
<a href="#">手机数码</a>
<ul>
<li><a href="#">手机数码1</a></li>
<li><a href="#">手机数码2</a></li>
<li><a href="#">手机数码3</a></li>
</ul>
</li>
<li οnmοuseοver="showMenu(this)" οnmοuseοut="hideMenu(this)">
<a href="#">淘宝集市</a>
<ul>
<li><a href="#">淘宝集市1</a></li>
<li><a href="#">淘宝集市2</a></li>
<li><a href="#">淘宝集市3</a></li>
</ul>
</li>
<li οnmοuseοver="showMenu(this)" οnmοuseοut="hideMenu(this)">
<a href="#">品牌商城</a>
<ul>
<li><a href="#">品牌商城1</a></li>
<li><a href="#">品牌商城2</a></li>
<li><a href="#">品牌商城3</a></li>
</ul>
</li>
</ul>
</div>
</body>
</html>