http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml">.menu{border:solid 1px bluewidth:140pxfont-size:16pxpadding:5pxmargin:0 auto}.menu a{display:blocktext-align:centercolor:redwidth:130pxheight:1.5empadding:4pxtext-decoration:noneposition:relative}.menu span{display:blockborder-style:solidborder-width:8pxoverflow:hiddenposition:absolutetop:4pxwidth:0pxheight:0pxoverflow:hidden}.menu a:link span{display:none}.menu a:hover span.left{display:blockborder-color:whiteborder-left-color:blackleft:8px}.menu a:hover span.right{display:blockborder-color:whiteborder-right-color:blackright:8px} http://www.baidu.com">class="left">junshao1 http://www.baidu.com">class="left">junshao1 http://www.baidu.com">class="left">junshao1 http://www.baidu.com">class="left">junshao1 http://www.baidu.com">class="left">junshao1 我改了一下，在IE7和FF3下测试通过，不知道是不是你要的效果，如果有出入的话我们可以再交流。
首先下拉菜单的样式是可以改变的，最关键的步骤是在select外层包裹一个div。
具体如下：
首先准备好一个你想替换成的样式的背景图片，因为这个效果是通过设置背景图片实现的。
在select外层包裹一层div，设置select的border:noneoutline-style:none(去除边框和选中时的边框)
设置select的背景为你之前准备好的效果图片。
css中很多效果都是通过这种去除边框，设置背景透明，再加上自己想要的背景图片来实现的。有时候甚至将整个元素整个设置透明，用自己制作的样式来替换。
并非是CSS制作的，而是HTML的表单当中的下拉菜单标签
比如
<select>
<option>HTML5学堂</option>
<option>原创技术文章分享</option>
</select>
如果你不希望使用系统自定义的下拉菜单，那么，你需要使用各种元素（比如div），进行定位等处理，实现想要的样式，再之后，需要使用JS进行控制
