<!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制作导航条菜单包含23种css导航菜单-xw素材网</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style type="text/css">
body { margin:0; padding:0; font: bold 11px/1.5em Verdana; }
h2 { font: bold 14px Verdana, Arial, Helvetica, sans-serif; color: #000; margin: 0px; padding: 0px 0px 0px 15px; }
img { border: none; }
/*- Menu Tabs 1--------------------------- */
#tabs1 { float:left; width:100%; background:#F4F7FB; font-size:93%; line-height:normal; border-bottom:1px solid #BCD2E6; }
#tabs1 ul { margin:0; padding:10px 10px 0 50px; list-style:none; }
#tabs1 li { display:inline; margin:0; padding:0; }
#tabs1 a { float:left; background:url("images/tableft1.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; }
#tabs1 a span { float:left; display:block; background:url("images/tabright1.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#627EB7; }
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs1 a span { float:none; }
/* End IE5-Mac hack */
#tabs a:hover span { color:#627EB7; }
#tabs1 a:hover { background-position:0% -42px; }
#tabs1 a:hover span { background-position:100% -42px; }
/*- Menu Tabs 2--------------------------- */
#tabs2 { float:left; width:100%; font-size:93%; line-height:normal; border-bottom:1px solid #84776B; }
#tabs2 ul { margin:0; padding:10px 10px 0 50px; list-style:none; }
#tabs2 li { display:inline; margin:0; padding:0; }
#tabs2 a { float:left; background:url("images/tableft2.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; }
#tabs2 a span { float:left; display:block; background:url("images/tabright2.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#84776B; }
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs2 a span { float:none; }
/* End IE5-Mac hack */
#tabs2 a:hover span { color:#74675B; }
#tabs2 a:hover { background-position:0% -42px; }
#tabs2 a:hover span { background-position:100% -42px; }
/*- Menu Tabs 3--------------------------- */
#tabs3 { float:left; width:100%; background:#E4E6EB; font-size:93%; line-height:normal; }
#tabs3 ul { margin:0; padding:10px 10px 0 50px; list-style:none; }
#tabs3 li { display:inline; margin:0; padding:0; }
#tabs3 a { float:left; background:url("images/tableft3.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; }
#tabs3 a span { float:left; display:block; background:url("images/tabright3.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#FFF; }
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs3 a span { float:none; }
/* End IE5-Mac hack */
#tabs3 a:hover span { color:#FFF; }
#tabs3 a:hover { background-position:0% -42px; }
#tabs3 a:hover span { background-position:100% -42px; }
/*- Menu Tabs 4--------------------------- */
#tabs4 { float:left; width:100%; font-size:93%; line-height:normal; border-bottom:1px solid #6B78A9; }
#tabs4 ul { margin:0; padding:10px 10px 0 50px; list-style:none; }
#tabs4 li { display:inline; margin:0; padding:0; }
#tabs4 a { float:left; background:url("images/tableft4.gif") no-repeat left top; margin:0; padding:0 0 0 7px; text-decoration:none; }
#tabs4 a span { float:left; display:block; background:url("images/tabright4.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#6B78A9; }
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs4 a span { float:none; }
/* End IE5-Mac hack */
#tabs4 a:hover span { color:#6B78A9; }
#tabs4 a:hover { background-position:0% -42px; }
#tabs4 a:hover span { background-position:100% -42px; }
/*- Menu Tabs 5--------------------------- */
#tabs5 { float:left; width:100%; background:#E3ECF3; font-size:93%; line-height:normal; }
#tabs5 ul { margin:0; padding:10px 10px 0 50px; list-style:none; }
#tabs5 li { display:inline; margin:0; padding:0; }
#tabs5 a { float:left; background:url("images/tableft5.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; }
#tabs5 a span { float:left; display:block; background:url("images/tabright5.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#FFF; }
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs5 a span { float:none; }
/* End IE5-Mac hack */
#tabs5 a:hover span { color:#FFF; }
#tabs5 a:hover { background-position:0% -42px; }
#tabs5 a:hover span { background-position:100% -42px; }
/*- Menu Tabs 6--------------------------- */
#tabs6 { float:left; width:100%; background:#efefef; font-size:93%; line-height:normal; border-bottom:1px solid #666; }
#tabs6 ul { margin:0; padding:10px 10px 0 50px; list-style:none; }
#tabs6 li { display:inline; margin:0; padding:0; }
#tabs6 a { float:left; background:url("images/tableft6.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; }
#tabs6 a span { float:left; display:block; background:url("images/tabright6.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#FFF; }
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs6 a span { float:none; }
/* End IE5-Mac hack */
#tabs6 a:hover span { color:#FFF; }
#tabs6 a:hover { background-position:0% -42px; }
#tabs6 a:hover span { background-position:100% -42px; }
/*- Menu Tabs 7--------------------------- */
#tabs7 { float:left; width:100%; background:#D4DAE7; font-size:93%; line-height:normal; border-bottom:1px solid #333B66; }
#tabs7 ul { margin:0; padding:10px 10px 0 50px; list-style:none; }
#tabs7 li { display:inline; margin:0; padding:0; }
#tabs7 a { float:left; background:url("images/tableft7.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; }
#tabs7 a span { float:left; display:block; background:url("images/tabright7.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#999; }
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs7 a span { float:none; }
/* End IE5-Mac hack */
#tabs7 a:hover span { color:#ECB546; }
#tabs7 a:hover { background-position:0% -42px; }
#tabs7 a:hover span { background-position:100% -42px; }
/*- Menu Tabs 8--------------------------- */
#tabs8 { float:left; width:100%; background:#FCF1F6; font-size:93%; line-height:normal; border-bottom:1px solid #E276A7; }
#tabs8 ul { margin:0; padding:10px 10px 0 50px; list-style:none; }
#tabs8 li { display:inline; margin:0; padding:0; }
#tabs8 a { float:left; background:url("images/tableft8.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; }
#tabs8 a span { float:left; display:block; background:url("images/tabright8.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#333; }
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs8 a span { float:none; }
/* End IE5-Mac hack */
#tabs8 a:hover span { color:#591333; }
#tabs8 a:hover { background-position:0% -42px; }
#tabs8 a:hover span { background-position:100% -42px; }
/*- Menu Tabs 9--------------------------- */
#tabs9 { float:left; width:100%; font-size:93%; border-bottom:1px solid #F45551; line-height:normal; }
#tabs9 ul { margin:0; padding:10px 10px 0 50px; list-style:none; }
#tabs9 li { display:inline; margin:0; padding:0; }
#tabs9 a { float:left; background:url("images/tableft9.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; }
#tabs9 a span { float:left; display:block; background:url("images/tabright9.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#FFF; }
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs9 a span { float:none; }
/* End IE5-Mac hack */
#tabs9 a:hover span { color:#FFF; }
#tabs9 a:hover { background-position:0% -42px; }
#tabs9 a:hover span { background-position:100% -42px; }
/*- Me
纯css制作23种导航条菜单
5星 · 超过95%的资源 需积分: 2 188 浏览量
2013-11-08
14:25:22
上传
评论
收藏 63KB RAR 举报 
css3.rar （47个子文件） 
css3 images 
tableft2.gif 1KB tableftD.gif 666B tabright12.gif 2KB tableft8.gif 680B tabrightF.gif 2KB tabright1.gif 955B tableft10.gif 637B tableft4.gif 1KB tableftI.gif 418B tabright11.gif 530B tabright.gif 408B tabrightJ.gif 2KB tableftJ.gif 666B tabrightC.gif 4KB tableftG.gif 240B tableftC.gif 626B tableftE.gif 1KB tabright4.gif 4KB tabrightK.gif 3KB tableft9.gif 677B tabright7.gif 982B tabrightE.gif 5KB tabrightI.gif 1KB tableft1.gif 246B tabright6.gif 945B tableft.gif 78B tableftH.gif 363B tableftK.gif 660B tabrightD.gif 3KB tabright2.gif 6KB tabrightH.gif 2KB tabright10.gif 2KB tableft5.gif 100B tabright3.gif 1KB tabright8.gif 4KB tableft6.gif 241B tableft7.gif 251B tableftF.gif 377B tableft3.gif 240B tableft12.gif 676B tabrightB.gif 1KB tabrightG.gif 939B tabright5.gif 518B tabright9.gif 2KB tableft11.gif 125B tableftB.gif 386B
index.html 32KB资源评论
andyzsf2014-01-03很好，可值得参考
4089855522016-04-28不错哦,值得用下么.
