1. <style type="text/css"> 
    2.  
         
  2. #Tab1{ 
                
    3.  
         
  3. padding:0px; 
    4.  
         
  4. border:1px solid #E4E4E4; 
    5.  
         
  5. margin-top:10px 
    6.  
         
  6. } 
    7.  
         
  7. .Menubox { 
    8.  
         
  8. height:30px; 
    9.  
         
  9. line-height:30px; 
    10.  
         
  10. background:url(../p_w_picpaths/sprite_bg.png) 0 -230px  no-repeat; 
    11.  
         
  11. } 
    12.  
         
  12. .Menubox ul{ 
    13.  
         
  13. margin:0px; 
    14.  
         
  14. padding:0px; 
    15.  
         
  15. } 
    16.  
         
  16. .Menubox li{ 
    17.  
         
  17. float:left; 
    18.  
         
  18. display:block; 
    19.  
         
  19. cursor:pointer; 
    20.  
         
  20. width:50%; 
    21.  
         
  21. text-align:center; 
    22.  
         
  22. background:url(p_w_picpaths/titlebg.gif) 0 -28px no-repeat; 
    23.  
         
  23. } 
    24.  
         
  24. .Menubox li.mhover{ 
    25.  
         
  25. padding:0px; 
    26.  
         
  26. background:#fff; 
    27.  
         
  27. width:50%; 
    28.  
         
  28. color:#A42023; 
    29.  
         
  29. font-weight:bold; 
    30.  
         
  30. height:30px; 
    31.  
         
  31. line-height:30px; 
    32.  
         
  32. } 
    33.  
         
  33. .Contentbox{ 
    34.  
         
  34. clear:both; 
    35.  
         
  35. margin-top:0px; 
    36.  
         
  36. border-top:none; 
    37.  
         
  37. height:250px; 
    38.  
         
  38. padding-top:8px; 
    39.  
         
  39. }  
    40.  
         
  40. </style> 
    41.  
         
  41.  
    42.  
         
  42. <script type="text/javascript">    
    43.  
         
  43. function setTab(name, cursel, n) { 
    44.  
         
  44. for (i = 1; i <= n; i++) { 
    45.  
         
  45. var menu = document.getElementById(name + i); 
    46.  
         
  46. var con = document.getElementById("con_" + name + "_" + i);  
    47.  
         
  47. menu.className = i == cursel ? "mhover" : ""; 
    48.  
         
  48. con.style.display = i == cursel ? "block" : "none"; 
    49.  
         
  49. } 
    50.  
         
  50. }       
    51.  
         
  51. </script> 
    52.  
         
  52.  
    53.  
         
  53. <body> 
    54.  
         
  54. <div id="Tab1"> 
    55.  
         
  55.  <div class="Menubox"> 
    56.  
         
  56.      <ul> 
    57.  
         
  57.         <li class="mhover" id="one1" οnmοuseοver="setTab('one',1,2)">热门促销 </li> 
    58.  
         
  58.         <li id="one2" οnmοuseοver="setTab('one',2,2)">网站公告 </li> 
    59.  
         
  59.         </ul> 
    60.  
         
  60.     </div> 
    61.  
         
  61.     <div class="Contentbox"> 
    62.  
         
  62.      <div id="con_one_1"> 
    63.  
         
  63.         abc 
    64.  
         
  64.         </div> 
    65.  
         
  65.         <div id="con_one_2" style="display: none"> 
    66.  
         
  66.         efd 
    67.  
         
  67.         </div> 
    68.  
         
  68.     </div> 
    69.  
         
  69. </div>  
    70.  
         
  70. </body> 
    71.