红白相间搭配的一款纯CSS菜单代码,来自国外网站,因此兼容性非常好,用到有背景图片,运行的时候自行保存一下。
代码内容:
<!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> <title>橘黄色的大气CSS菜单代码_网页代码站()</title> <style> #time4bed-nav{position:relative;height:43px;font-size:14px;text-transform:uppercase;background:#fff url ("http://www.webdm.cn/images/20090920/time4bed_bg.gif") repeat-x bottom left;font-family:Georgia, "Times New Roman", Times, serif;} #time4bed-nav ul{margin:0;padding:0;list-style-type:none;width:auto;float:left;} #time4bed-nav ul li{display:block;float:left;margin:0 2px;} #time4bed-nav ul li a{display:block;float:left;color:#ffdab6;text-decoration:none;padding:0 0 0 25px;height:43px;line-height:50px;} #time4bed-nav ul li a span{display:block;float:left;padding:0 25px 0 0;height:31px;width:auto;} #time4bed-nav ul li a:hover{color:#fff;} #time4bed-nav ul li a:hover span{display:block;cursor:pointer;} #time4bed-nav ul li a.current,#time4bed-nav ul li a.current:hover{color:#894d12;background:transparent url ("http://www.webdm.cn/images/20090920/time2bed_left-ON.gif") no-repeat top left;} #time4bed-nav ul li a.current span{background:transparent url ("http://www.webdm.cn/images/20090920/time2bed_right-ON.gif") no-repeat top right;height:43px;} </style> </head> <body> <div> <ul> <li><a href="http://www.webdm.cn" title="css menus"><span>Home</span></a></li> <li><a href="http://www.likecs.com/" title="css menus"><span>About Us</span></a></li> <li><a href="http://www.likecs.com/" title="css menus"><span>Services</span></a></li> <li><a href="http://www.likecs.com/" title="css menus"><span>WebDm.CN</span></a></li> <li><a href="http://www.likecs.com/" title="css menus"><span>Contact Us</span></a></li> </ul> </div> </body> </html> <br> <p><a href="http://www.webdm.cn">网页代码站</a> - 最专业的代码下载网站 - 致力为中国站长提供有质量的代码!</p>