<ptml> <pead> <style type= "Text/css" > * {padding-bottom:0px; margin:0px; padding-left:0px; padding-right:0px; font-size:12px; padding-top:0px; } body {padding-left:20px; padding-top:20px; }. wid240 {width:242px; margin-bottom:20px; }. wid180 {width:182px; }. tab {border-bottom: #000 1px solid; Border-left: #000 1px solid; Border-top: #000 1px solid; Border-right: #000 1px solid; }. tab UL {zoom:1; Clear:both; }. tab Ul:after {Display:block; height:0px; Visibility:hidden; Clear:both; Content: ""; }. tab UL LI {text-align:center; line-height:26px; width:60px; Display:inline; Background: #000; Float:left; height:26px; Color: #fff; }. tab UL li.on {background: #fff; Color: #000; }. tablist {border-bottom: #000 1px solid; Border-left: #000 1px solid; height:150px; Border-top: #000 1px; Border-right: #000 1px solid; } tablist. one {padding-bottom:10px; Padding-left: 10px; padding-right:10px; Display:none; Color: #ff0000; padding-top:10px; }. Tablist. block {display:block; } </style> <script type= "Text/javascript" > Function Settab (name,m,n) {for (Var i=1;i<=n;i++) {var men U = document.getElementById (name+i); var showdiv = document.getElementById ("Cont_" +name+ "_" +i); Menu.classname = i==m? " On ":"; ShowDiv.style.display = i==m? " Block ": none"; } </script> <meta name= "generator" content= "MSHTML 8.00.7600.16535" > </pead> <body> <d IV class= "wid240" > <div class= "tab" > <ul> <li id= "one1" class= "on" Onmouseover= ' Settab "(" One ", 1,4) ' &G T;one1 </li> <li id= "One2" onmouseover= ' Settab ("one", 2,4) ' >one2 </li> <li id= ' one3 ' onmouseover= ' Settab ("One", 3,4) ' >one3 </li> <li id= ' one4 ' onmouseover= ' Settab ("one", 4,4) ' >one4 </li> </ul > </div> <div class= "Tablist" > <div id= "cont_one_1" class= "one block" > Cont_one_1</div> <div id= "cont_one_2" class= "one" > cont_one_2</div> <div id= "Cont_one_3" One "> cont_one_3</div> <div id=" Cont_one_4 "class=" one "> cont_one_4</div> </div> </div& Gt <div class= "wid180" > <div class= "tab" > <ul> <li id= "Tow1" class= "on" onclick= ' Settab ("tow", 1, 3) ' & Gt;tow1 </li> <li id= "tow2" onclick= ' Settab ("tow", 2,3) ' >tow2 </li> <li id= ' tow3 ' onclick= ' Settab ( "Tow", 3,3) ' >tow3 </li> </ul> </div> <div class= ' tablist ' > <div id= ' cont_tow_1 ' class= ' on E block "> cont_tow_1</div> <div id=" cont_tow_2 "class=" one "> cont_tow_2</div> <div id=" cont_to W_3 "class=" one "> cont_tow_3</div> </div> </div> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]