闲来没事就自己写了，取值于拍拍。代码自己整理的。<!DOCTYPE <a href='http://www.itjxue.com/plus/search.php?kwtype=0&keyword=html&' target='_blank'><u>html</u></a>> <html lang="zh-cn"> <head> <meta charset="UTF-8" /> <title>tab style</title> <style type="text/css"> a,a:visited,a:hover,a:active{ text-decoration:none; } .tabred{ list-style:none; width:600px; padding-left:20px; height:27px; margin:10px auto; border-bottom:2px solid #AD0007; } .tabred li{ float:left; height:26px; line-height:24px; margin-right:5px; padding:0 12px; border-top:1px solid #ddd; border-right:1px solid #ddd; border-left:1px solid #ddd; font-size:14px; list-style:none; background:-moz-linear-gradient(top, #fff 0, #f3f3f3 100%); background:-webkit-gradient(linear, 0 0, 0 100%, from(#fff), to(#f3f3f3)); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f3f3f3', GradientType="0"); background:linear-gradient(top, #fff 0%, #f3f3f3 100%); border-radius:2px 2px 0 0; -moz-border-radius:2px 2px 0 0; -webkit-border-radius:2px 2px 0 0; } .tabred li.current{ border-color:#c30008; background:-moz-linear-gradient(-90deg, #d5000a 0, #ad0007 100%); background:-webkit-gradient(linear, 0 0, 0 100%, from(#d5000a), to(#ad0007)); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#d5000a', endColorstr='#ad0007', GradientType="0"); background:linear-gradient(top, #d5000a 0, #ad0007 100%); } .tabred li a,.tabred li a:visited{ color:#666; } .tabred li a:hover,.tabred li a:active{ color:#666; } .tabred li.current a,.tabred li.current a:visited{ font-weight:bold; color:#fff; } </style> </head> <body> <ul class="tabred"> <li><a href="#">我是买家</a></li> <li><a href="#">我是卖家</a></li> <li class="current"><a href="#">我的帐户</a></li> <li><a href="#">账户管理</a></li> <li><a href="#">我是自适应的</a></li> </ul> </body> </html>
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]