导航条加个图片

2016-07-07 16:08 来源:www.chinab4c.com 作者:ecshop专家

导航条加个图片。

用雅黑字体的图片把导航栏宋体的栏目覆盖掉的。

请懂代码的朋友,发个代码和样式上来。谢谢。

回答:
  1. /*menu*/
  2. .menu_box{height:26px; overflow:hidden; background:url(/menu_bg.gif) repeat-x; border-top:1px solid #1D4A3B; border-bottom:1px solid #B4BCC3;}
  3. .menu{width:1000px; height:26px;overflow:hidden; margin:0px auto; color:#FFFFFF; text-align:center; font-weight:bold; line-height:26px; position:relative;}
  4. .menu li{float:left;height:26px;overflow:hidden;}
  5. .menu li a{ display:block; height:26px; background:url(/menu_1104.gif) no-repeat transparent;}
  6. .menu li.mm0 a{ width:69px; background-position:0px 0px;}
  7. .menu li.mm0 a.m0{width:69px; background-position:0px -30px;}

  8. .menu li.mm1 a{ width:52px; background-position:-70px 0px;}
  9. .menu li.mm1 a.m1{width:52px; background-position:-70px -30px;}

  10. .menu li.mm2 a{ width:50px; background-position:-120px 0px;}
  11. .menu li.mm2 a.m2{width:50px; background-position:-120px -30px;}

  12. .menu li.mm3 a{ width:48px; background-position:-171px 0px;}
  13. .menu li.mm3 a.m3{ width:48px; background-position:-171px -30px;}

  14. .menu li.mm4 a{ width:48px; background-position:-219px 0px;}
  15. .menu li.mm4 a.m4{ width:48px; background-position:-219px -30px;}

  16. .menu li.mm5 a{ width:52px; background-position:-268px 0px;}
  17. .menu li.mm5 a.m5{ width:52px; background-position:-268px -30px;}

  18. .menu li.mm6 a{ width:52px; background-position:-319px 0px;}
  19. .menu li.mm6 a.m6{ width:52px; background-position:-319px -30px;}

  20. .menu li.mm7 a{ width:52px; background-position:-371px 0px;}
  21. .menu li.mm7 a.m7{ width:52px; background-position:-371px -30px;}

  22. .menu li.mm8 a{ width:66px; background-position:-422px 0px;}
  23. .menu li.mm8 a.m8{ width:66px; background-position:-422px -30px;}

  24. .menu li.mm9 a{ width:52px; background-position:-488px 0px;}
  25. .menu li.mm9 a.m9{ width:52px; background-position:-488px -30px;}

  26. .menu li.mm10 a{ width:52px; background-position:-539px 0px;}
  27. .menu li.mm10 a.m10{ width:52px; background-position:-539px -30px;}

  28. .menu li.mm11 a{ width:51px; background-position:-592px 0px;}
  29. .menu li.mm11 a.m11{ width:51px; background-position:-592px -30px;}

  30. .menu li.mm12 a{ width:52px; background-position:-642px 0px;}
  31. .menu li.mm12 a.m12{ width:52px; background-position:-642px -30px;}

  32. .menu li.mm13 a{ width:50px; background-position:-692px 0px;}
  33. .menu li.mm13 a.m13{ width:50px; background-position:-692px -30px;}


  34. .menu li.mm14 a{ width:95px; background-position:-743px 0px;}
  35. .menu li.mm15 a{ width:86px; background-position:-838px 0px;}
  36. .menu li.mm16 a{ width:73px; background-position:-924px 0px;}
复制代码
这是CSS样式。定义该样式代码,在哪定义的呢?

学习了

呵呵,热心版主呢,帮个忙哦。