一款简单另类的CSS导航菜单代码
代码简介:
很个性的一个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> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>一款简单另类的CSS导航菜单代码_网页代码站(www.webdm.cn)</title> <style type="text/css"> <!-- #navlist { padding: 0 1px 1px; margin-left: 0; font: bold 12px Verdana, sans-serif; } #navlist li { list-style: none; margin: 0; border-top: 1px solid gray; display: inline; } #navlist li a { padding: 0.25em 0.5em 0.25em 0.75em; border-left: 1em solid #AAB; background: #CCD; text-decoration: none; } #navlist li a:link { color: #448; } #navlist li a:visited { color: #667; } #navlist li a:hover { border-color: #FE3; color: #FFF; background: #332; } --> </style> </head> <body> <div id="navcontainer"> <ul id="navlist"> <li id="active"><a href="/" id="current">WebDm.Cn</a></li> <li><a href="http://webdm.cn">ASP</a></li> <li><a href="#">PHP</a></li> <li><a href="#">JSP</a></li> <li><a href="/">AJAX</a></li> </ul> </div> </body> </html> <br> <p><a href="http://www.webdm.cn">网页代码站</a> - 最专业的代码下载网站 - 致力为中国站长提供有质量的代码!</p>
代码来自http://www.webdm.cn/webcode/d9ac64f8-377e-4fc6-b786-bcb5b5013c46.html