横向背景变换菜单

这是段 横向背景变换菜单的代码样式都在页面里，直接粘到html页面里就可以看到效果哦！

这是菜单用到的css样式
#submenu {
MARGIN:160px 80px;
PADDING:5px;
BORDER: #fff 1px solid;
BACKGROUND: #dfdfdf;
COLOR: #666;
width:800px; height:25px;}
#submenu ul{ margin:0; padding:0; list-style:none;}
#submenu ul li{ margin:0; width:113px; text-align:center; float:left;}
#submenu ul li a{ padding:5px 0px; display:block; color:#000; text-decoration:none;}
#submenu ul li a:hover{ background:#ff6600; color:#FFFFFF; font-family:"微软雅黑";}


下面是菜单的代码：

<div id="submenu"> 
<ul>
<li><a title="首页" href="http://www.yzci.com/">Home</a></li>
<li><a title="关于我们" href="http://www.yzci.com/aboutus.html">关于我们</a></li>
<li><a title="网站标准" href="http://www.yzci.com/webstandards.html">网站标准</a></li>
<li><a title="标准的好处" href="http://www.yzci.com/benefits.html">标准的好处</a></li>
<li><a title="怎样过渡" href="http://www.yzci.com /howto.html">怎样过渡</a></li>
<li><a title="相关教程" href="http://www.yzci.com/tutorial.html">相关教程</a></li>
<li><a title="工具" href="http://www.yzci.com/tools.html">工具</a></li>
</ul>
</div>


效果见附件：是原文件
/upload/art_pic/file/20120316/20120316093504_17626.rar
秦皇岛网络公司炎黄科技美工自己写的，源码分享给大家！