div+css怎么实现这个导航栏的样式呀？

div+css怎么实现这个导航栏的样式呀？

正好在写这么个导航条效果l
<!------------------头部导航开始------------------>
<div class="top w1000 bc">
<ul>
<li class="top_left"></li>
<li class="home w100"></li>
<i></i>
<li class="w100"><a href="#">快速导航</a></li>
<i></i>
<li class="w100"><a href="#">产品目录</a></li>
<i></i>
<li class="w100"><a href="#">设备保修</a></li>
<i></i>
<li class="w100"><a href="#">技术咨询</a></li>
<i></i>
<li class="w100"><a href="#">速查表</a></li>
<i></i>
<li class="w100"><a href="#">公司大事记</a></li>
<i></i>
<li class="search"><div class="search">
<input type="text" name="search" size="35" value="请输入您要搜索的机器名称或产品名称">
</div></li>
<li class="top_right"></li>
</ul>
<!--------------------导航结束---------------->
</div>

2011-09-09

那个是背景图片 ，你可以把百度的这个页另存为，你看看他的代码和图片就明白了2011-09-08

这个可以用背景图片 图片就是一个竖线 具体的2011-09-09

可以是图片，也可以定义width和height2011-09-08