仿windows頁籤-1

1??

<STYLE type=text/css>.sec1 {

??? BORDER-RIGHT: gray 1px solid; BORDER-TOP: #ffffff 1px solid; BORDER-LEFT: #ffffff 1px solid; CURSOR: hand; COLOR: #000000; BORDER-BOTTOM: #ffffff 1px solid; BACKGROUND-COLOR: #eeeeee

}

.sec2 {

??? BORDER-RIGHT: gray 1px solid; BORDER-TOP: #ffffff 1px solid; FONT-WEIGHT: bold; BORDER-LEFT: #ffffff 1px solid; CURSOR: hand; COLOR: #000000; BACKGROUND-COLOR: #d4d0c8

}

.main_tab {

??? BORDER-RIGHT: gray 1px solid; BORDER-LEFT: #ffffff 1px solid; COLOR: #000000; BORDER-BOTTOM: gray 1px solid; BACKGROUND-COLOR: #d4d0c8

}

</STYLE>

??????????? <SCRIPT language=javascript>

???? function secBoard(n)

? {

??? for(i=0;i<secTable.cells.length;i++)

????? secTable.cells[i].className="sec1";

??? secTable.cells[n].className="sec2";

??? for(i=0;i<mainTable.tBodies.length;i++)

????? mainTable.tBodies[i].style.display="none";

??? mainTable.tBodies[n].style.display="block";

? }

????? </SCRIPT>

??????????? <TABLE id=secTable cellSpacing=0 cellPadding=0 width=549 10%">1</TD>

???????????????

??? <TD class=sec1 慰nclick=secBoard(1) width="10%">2</TD>

???????????????

??? <TD class=sec1 慰nclick=secBoard(2) width="10%">3</TD>

???????????????

??? <TD class=sec1 慰nclick=secBoard(3)

????????????? width="10%">4</TD>

? </TR></TBODY></TABLE>

??????????? <TABLE class=main_tab id=mainTable height=240 cellSpacing=0

??????????? cellPadding=0 width=549 DISPLAY: block">

????????????? <TR>

??????????????? <TD vAlign=top align=middle><BR><BR>

????????????????? <TABLE cellSpacing=0 cellPadding=0 width=490 tutu16.gif"><BR>

???????????

????????????? <TBODY style="DISPLAY: none">

????????????? <TR>

??????????????? <TD vAlign=top align=middle><BR><BR>

????????????????? <TABLE cellSpacing=0 cellPadding=0 width=490 tutu24.gif"><BR>

? <select name="select" style="background:#FF0000;color:white">

??? <option >?わ?椋?涔?缇戒???</option>

??? <option>ddddddddddddd</option>

??? <option>ddddddddddddddddd</option>

??? <option>eeeeeeeeeeeeeeee</option>

? </select>

</form>????????

</TD></TR></TBODY></TABLE></TD></TR></TBODY>

????????????? <TBODY style="DISPLAY: none">

????????????? <TR>

??????????????? <TD vAlign=top align=middle><BR><BR>

????????????????? <TABLE cellSpacing=0 cellPadding=0 width=490 tutu30.gif"><BR>

<!--

.formstyle { font-family: "瀹?浣?"; font-size: 10pt; color: #FF0000; background-color: #FFFFCC}

-->

</style>

</select>

</form>

??????????? <BR></TD></TR></TBODY></TABLE></TD></TR></TBODY><!--?充?display灞???->

????????????? <TBODY style="DISPLAY: none">

????????????? <TR>

??????????????? <TD vAlign=top align=middle><BR><BR>

????????????????? <TABLE cellSpacing=0 cellPadding=0 width=490 tutu34.gif"><br>

? <tr>

??? <a href="a12.html" target="_blank" rel="external nofollow" ><td bgcolor="#FFFFFF" onMouseOver="this.style.color='#ffffff'; this.style.background='#003399'" onMouseOut="this.style.color='#003399'; this.style.background='#ffffff'" style="cursor: hand">?闆?ㄤ技涓?涓?浼間???lt;/td></a>

? </tr>

</table>

</TD>

??????? </TR></TBODY></TABLE></TD></TR></TBODY></TABLE></p>?

2??

<html>

<head>

<title> New Document </title>

body,table,tr,td{

?font-size:12px;

?color:#000000;

.sec1 {

??? background-color: #99CC99;

??? cursor: hand;

??? color: #000000;

??? border-left: 1px solid #FFFFFF;

??? border-top: 1px solid #FFFFFF;

??? border-right: 1px solid gray;

??? border-bottom: 1px solid #FFFFFF

??? }

.sec2 {

??? background-color: #D4D0C8;

??? cursor: hand;

??? color: #000000;

??? border-left: 1px solid #FFFFFF;

??? border-top: 1px solid #FFFFFF;

??? border-right: 1px solid gray;

??? font-weight: bold;

??? }

.main_tab {

??? background-color: #D4D0C8;

??? color: #000000;

??? border-left:1px solid #FFFFFF;

??? border-right: 1px solid gray;

??? border-bottom: 1px solid gray;

??? }

</style>??? <script language="javascript">

<!--

function secBoard(n,x,y)

{

? for(i=0;i<secTable.cells.length;i++){

??? secTable.cells[i].className="sec1";

? secTable.cells[n].className="sec2";}

? for(i=0;i<mainTable.tBodies.length;i++){

??? mainTable.tBodies[i].style.display="none";

? mainTable.tBodies[n].style.display="block";}

? weizi.innerHTML="<b>"+x.toUpperCase()+"</b>灞?棣?<b>"+y+"</b>妤煎???";

}

//-->

</script>

</head>

? <tr>

??? <td width="82%">褰???浣?缃?锛?灞?棣???甯? > <span id="weizi"><b>A</b>灞?棣?<b>1</b>妤煎???</span></td>

??? <td width="18%"></td>

? </tr>

? <tr>

??? <td colspan="2" height="1" bgcolor="#000000"></td>

? </tr>

? <tr>

??? <td colspan="2" height="4"></td>

? </tr>

? <tr>

??? <td colspan="2">

????? <table secBoard(0,'a','1')">A灞?棣?1妤煎???</td>

????????? <td class=sec1 width=10% onClick="secBoard(1,'a','2')">A灞?棣?2妤煎???</td>

????????? <td class=sec1 width=10% onClick="secBoard(2,'b','1')">B灞?棣?1妤煎???</td>

????????? <td class=sec1 width=10% onClick="secBoard(3,'b','2')">B灞?棣?2妤煎???</td>

????????? <td class=sec1 width=10% onClick="secBoard(4,'c','1')">C灞?棣?1妤煎???</td>

????????? <td class=sec1 width=10% onClick="secBoard(5,'c','2')">C灞?棣?2妤煎???</td>

??????? </tr>

????? </table>

????? <table display:block;">

??????? <tr>

????????? <td align="center">

??????????? 涓?

????????? </td>

??????? </tr>

??????? </tbody> <tbody style="display:none;">

??????? <tr>

????????? <td align="center">

??????????? 浜?

????????? </td>

??????? </tr>

??????? </tbody> <tbody style="display:none;">

??????? <tr>

????????? <td align="center">

??????????? 涓?

????????? </td>

??????? </tr>

??????? </tbody> <tbody style="display:none;">

??????? <tr>

????????? <td align="center">

??????????? ??

????????? </td>

??????? </tr>

??????? </tbody><tbody style="display:none;">

??????? <tr>

????????? <td align="center">

??????????? 浜?

????????? </td>

??????? </tr>

??????? </tbody><tbody style="display:none;">

??????? <tr>

????????? <td align="center">

??????????? ??

????????? </td>

??????? </tr>

??????? </tbody>

????? </table>

??? </td>

? </tr>

</table>

3??

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>????棰???妗?lt;/title>

var txtstr_1="??QQ:28983016? Email:<a href=mailto:[email?protected]>[email?protected]</a>";

var txtstr_2="????瑕?杞?浠剁????????浠ヤ?????绯彙??";

var txtstr_3="??璁哄???闆?ㄦ???跺?抽??锛?璇鋒????浠???Q涓???绯?"

var txtstr_4="??瀛ょ?????跺??渚胯蛋?????訛?<br>瀵?瀵????跺??渚胯蛋???充?锛?<br>澶辮觸???跺??渚胯蛋???ф??锛?<br>濮?灞????跺??渚胯蛋??????????????<br>"

function changediv(n){

for(i=1;i<=5;i++){

eval("document.getElementById('s'+i+'').className='under'+n+''");

//姝ゆ?″驚????浣??ㄦ??????灏?s寮?澶寸??ID澶???涓?杈圭??璁劇疆涓虹?稿???棰???}

for(i=1;i<=4;i++){

eval("document.getElementById('c"+i+"').className='a"+n+"'");

//姝ゆ?″驚????濮???????????椤瑰?℃???????????劇??涓?b0.gif锛??剁?拌??}

eval("document.getElementById('c"+n+"').className='t"+n+"'");

//?跺??璁劇疆榧???绉誨?ㄥ?扮???稿?浣?缃????????劇??涓虹?稿????劇??锛?淇??瑰?瑰????峰?琛ㄣ??

eval("document.getElementById('bodyt').className='body"+n+"'");

//淇??歸??椤瑰?′????ㄧ???峰?锛?浣垮?剁???插僵涓?涓????ㄧ???劇???擱??搴???

bodytxt=eval('txtstr_'+n);

if(bodytxt==""){

alert("?版??姝ｅ?ㄤ?杞斤?璇風???!");}

else

{

document.getElementById("txt1").innerHTML=bodytxt;

//璁劇疆??椤瑰?′富浣??ㄥ???稿?????瀛???

}

</script>

<!--

.t1 {

??? background-image: url(cb1.gif);

??? border-bottom-width: medium;

??? border-bottom-style: none;

??? border-right-width: 1px;

??? border-right-style: solid;

??? border-right-color: #88c027;

}

.t2 {

??? background-image: url(cb2.gif);

??? padding-top: 3px;

??? border-right-width: 1px;

??? border-right-style: solid;

??? border-right-color: #eac751;

}

.t3 {

??? background-image: url(cb3.gif);

??? padding-top: 3px;

??? border-right-width: 1px;

??? border-right-style: solid;

??? border-right-color: #ee6f69;

}

.t4 {

??? background-image: url(cb4.gif);

??? padding-top: 3px;

??? border-right-width: 1px;

??? border-right-style: solid;

??? border-right-color: #7eaffb;

}

.t0 {

??? background-image: url(cb0.gif);

??? padding-top: 3px;

??? border-bottom-width: 0px;

??? border-bottom-style: none;

??? border-right-width: 1px;

??? border-right-style: solid;

??? border-right-color: #AEABA9;

}

-->

</style>

<!--

td {

??? font-size: 12px;

??? line-height: 16px;

}

.d1 {

??? padding-top: 3px;

??? border-bottom-width: medium;

??? border-bottom-style: none;

}

.d2{

??? padding-top: 3px;

??? border-bottom-width: medium;

??? border-bottom-style: none;

}

.d3{

??? padding-top: 3px;

??? border-bottom-width: medium;

??? border-bottom-style: none;

}

.d4{

??? padding-top: 3px;

??? border-bottom-width: medium;

??? border-bottom-style: none;

}

.under1 {

??? border-bottom-width: 1px;

??? border-bottom-style: solid;

??? border-bottom-color: #88c027;

}

.under2 {

??? border-bottom-width: 1px;

??? border-bottom-style: solid;

??? border-bottom-color: #eac751;

}

.under3 {

??? border-bottom-width: 1px;

??? border-bottom-style: solid;

??? border-bottom-color: #ee6f69;

}

.under4 {

??? border-bottom-width: 1px;

??? border-bottom-style: solid;

??? border-bottom-color: #7eaffb;

}

.body1 {

??? background-color: #d6efb5;

??? border-top: 0px none;

??? border-right: 1px solid #88c027;

??? border-bottom: 1px solid #88c027;

??? border-left: 1px solid #88c027;

}

.body2 {

??? background-color:#fff7be;

??? border-top: 0px none #eac751;

??? border-right: 1px solid #eac751;

??? border-bottom: 1px solid #eac751;

??? border-left: 1px solid #eac751;

}

.body3 {

??? background-color: #ffe5e3;

??? border-top: 0px none;

??? border-right: 1px solid #ee6f69;

??? border-bottom: 1px solid #ee6f69;

??? border-left: 1px solid #ee6f69;

}

.body4 {

??? background-color: #d4eaff;

??? border-top: 0px none;

??? border-right: 1px solid #7eaffb;

??? border-bottom: 1px solid #7eaffb;

??? border-left: 1px solid #7eaffb;

}

.firstunderline {

??? border-bottom-width: medium;

??? border-bottom-style: none;

}

.bodytop {

??? border-top-width: medium;

??? border-top-style: none;

}

-->

</style>

<!--

.a1 {

??? background-image: url(cb0.gif);

??? border-bottom-width: 1px;

??? border-bottom-style: solid;

??? border-bottom-color: #88c027;

??? border-right-width: 1px;

??? border-right-style: solid;

??? border-right-color: #AEABA9;

}

.a2 {

??? background-image: url(cb0.gif);

??? border-bottom-width: 1px;

??? border-bottom-style: solid;

??? border-bottom-color: #eac751;

??? border-right-width: 1px;

??? border-right-style: solid;

??? border-right-color: #AEABA9;

}

.a3 {

??? border-bottom-width: 1px;

??? border-bottom-style: solid;

??? border-bottom-color: #ee6f69;

??? background-image: url(cb0.gif);

??? border-right-width: 1px;

??? border-right-style: solid;

??? border-right-color: #AEABA9;

}

.a4 {

??? background-image: url(cb0.gif);

??? border-bottom-width: 1px;

??? border-bottom-style: solid;

??? border-bottom-color: #7eaffb;

??? border-right-width: 1px;

??? border-right-style: solid;

??? border-right-color: #AEABA9;

}

.temp {

??? background-image: url(cb0.gif);

??? border-bottom-width: 1px;

??? border-bottom-style: solid;

??? border-bottom-color: #88c027;

??? border-right-width: 1px;

??? border-right-style: solid;

??? border-right-color: #AEABA9;

}

-->

</style>

</head>

<body>

? <tr valign="bottom">

??? <td id="s1" width="8" height="19" class="under1"><br> </td>

??? <td id="c1" width="60" align="center" class="t1" onMouseOver="changediv(1)">??浣?灞變漢</td>

??? <td id="s2" width="8" class="under1"><br> </td>

??? <td id="c2" width="60" align="center" class="temp" onMouseOver="changediv(2)">绾㈣?查?瀹?lt;/td>

??? <td id="s3" width="8" class="under1"><br> </td>

??? <td id="c3" width="60" align="center" class="temp" onMouseOver="changediv(3)">???叉????</td>

??? <td id="s4" width="8" class="under1"><br> </td>

??? <td id="c4"? width="60" align="center" class="temp" onMouseOver="changediv(4)"">瀛ら?堕?瀹?lt;/td>

??? <td id="s5" width="49" class="under1"><br>

</td>

? </tr>

</table>

? <tr>

??? <td valign="top"><br><div id="txt1">

??? <script language="javascript">

??? document.write(txtstr_1);

??? </script>

??? </div>?</td>

???

? </tr>

? </tbody>

</table>

4??

<html>

<head>

<title> New Document </title>

body,table,tr,td{

?font-size:12px;

?color:#000000;

.sec1 {

??? background-color: #99CC99;

??? cursor: hand;

??? color: #000000;

??? border-left: 1px solid #FFFFFF;

??? border-right: 1px solid gray;

??? border-bottom: 1px solid #FFFFFF

??? }

.sec2 {

??? background-color: #D4D0C8;

??? cursor: hand;

??? color: #000000;

??? border-left: 1px solid #FFFFFF;

??? border-right: 1px solid gray;

??? font-weight: bold;

??? }

.main_tab {

??? background-color: #D4D0C8;

??? color: #000000;

??? border-left:1px solid #FFFFFF;

??? border-right: 1px solid gray;

??? border-bottom: 1px solid gray;

??? }

</style>??

</head>

? <tr>

??? <td width="82%">褰???浣?缃?锛?灞?棣???甯? > <span id="weizi">A灞?棣?1妤煎???</td>

??? <td width="18%"></td>

? </tr>

? <tr>

??? <td colspan="2" height="1" bgcolor="#000000"></td>

? </tr>

? <tr>

??? <td colspan="2" height="4"></td>

? </tr>

? <tr>

??? <td colspan="2">

????? <table A7" onClick="secBoard()">A灞?棣?1妤煎???</td>

????????? <td class=sec1 id="A8" onClick="secBoard()">B灞?棣?1妤煎???</td>

????????? <td class=sec1 id="A9" onClick="secBoard()">B灞?棣?2妤煎???</td>

????????? <td class=sec1 id="A10" onClick="secBoard()">C灞?棣?1妤煎???</td>

????????? <td class=sec1 id="A11" onClick="secBoard()">C灞?棣?2妤煎???</td>

??????? </tr>

????? </table>

????? <table B1" onClick="secBoard()">A灞?棣?1妤煎???</td>

????????? <td class=sec1 id="B2" onClick="secBoard()">A灞?棣?2妤煎???</td>

????????? <td class=sec1 id="B3" onClick="secBoard()">B灞?棣?1妤煎???</td>

????????? <td class=sec1 id="B4" onClick="secBoard()">B灞?棣?2妤煎???</td>

????????? <td class=sec1 id="B5" onClick="secBoard()">C灞?棣?1妤煎???</td>

????????? <td class=sec1 id="B6" onClick="secBoard()">C灞?棣?2妤煎???</td>

??????? </tr>

????? </table>

????? <table display:block;">

??????? <tr>

????????? <td align="center">

??????????? 涓?

????????? </td>

??????? </tr>

??????? </tbody> <tbody style="display:none;">

??????? <tr>

????????? <td align="center">

??????????? 浜?

????????? </td>

??????? </tr>

??????? </tbody> <tbody style="display:none;">

??????? <tr>

????????? <td align="center">

??????????? 涓?

????????? </td>

??????? </tr>

??????? </tbody> <tbody style="display:none;">

??????? <tr>

????????? <td align="center">

??????????? ??

????????? </td>

??????? </tr>

??????? </tbody><tbody style="display:none;">

??????? <tr>

????????? <td align="center">

??????????? 浜?

????????? </td>

??????? </tr>

??????? </tbody><tbody style="display:none;">

??????? <tr>

????????? <td align="center">

??????????? ??

????????? </td>

??????? </tr>

??????? </tbody><tbody style="display:none;">

??????? <tr>

????????? <td align="center">

??????????? 涓?

????????? </td>

??????? </tr>

??????? </tbody><tbody style="display:none;">

??????? <tr>

????????? <td align="center">

??????????? ??

????????? </td>

??????? </tr>

??????? </tbody><tbody style="display:none;">

??????? <tr>

????????? <td align="center">

??????????? 涔?

????????? </td>

??????? </tr>

??????? </tbody><tbody style="display:none;">

??????? <tr>

????????? <td align="center">

??????????? ??

????????? </td>

??????? </tr>

??????? </tbody><tbody style="display:none;">

??????? <tr>

????????? <td align="center">

??????????? ??涓?

????????? </td>

??????? </tr>

??????? </tbody>

????? </table>

<!--

var lastObj="B1",strClassBlur="sec1",strClassActive="sec2";

var tbody=document.getElementById("mainTable").getElementsByTagName("TBODY");

var secTableA=document.getElementById("secTableA");

var secTableB=document.getElementById("secTableB");

function secBoard()

{??? var n=event.srcElement.id;

??? if(lastObj == n)return;

??? if(n.charAt(0) != lastObj.charAt(0)) secTableA.swapNode(secTableB);

??? eval(n).className=strClassActive;

??? titleChange(eval(n).innerText);

??? eval(lastObj).className=strClassBlur;

??? tbody[getNum(lastObj)].style.display="none";

??? tbody[getNum(n)].style.display="block";

??? lastObj=n;

}

function getNum(str)

{

??? return parseInt(str.substr(1))-1;

}

function titleChange(text)

{

??? weizi.innerText=text;

}

//-->

</script>

??? </td>

? </tr>

</table>

5??

<html>

<head>

<!--

body{font-family: 'MS Shell Dlg', 瀹?浣?, Tahoma;font-size: 12px;background-color: #336699;color:#000000;}

td, div, input, textarea{font-family: 'MS Shell Dlg', 瀹?浣?, Tahoma;font-size: 12px;cursor: default;}

.title{background-color: #000080;color:#fdf7d3;padding: 1;font-family:瀹?浣?;font-size:12px;}

.up{background-color: #cccccc;color:#000000;border: 2px outset #ffffff}

.down{background-color: #cccccc;border:2px inset #ffffff}

.up1{background-color: #cccccc;color: #000000;border: 1px outset #ffffff}

.down1{background-color:#cccccc;border:1px inset #ffffff}

.l?????????? { background-color: #cccccc; height: 18px; border-left: 2px outset #ffffff;

?????????????? border-right: 2px outset #ffffff; color:#000000;

?????????????? border-top: 2px outset #ffffff; padding-top: 2;height:18}

.lc?????????? { background-color: #cccccc; height: 18px; border-left: 2px outset #ffffff;

?????????????? border-right: 2px outset #ffffff; color:#000000;

?????????????? border-top: 2px outset #ffffff; padding-top: 2;height:20}

.l-h???????? { background-color: #cccccc; border-left: 2px outset #ffffff ; border-top: 2px outset #ffffff;color:#000000; }

.l-c???????? { background-color: #cccccc; border-top: 2px outset #ffffff }

.l-r???????? { background-color: #cccccc; border-right: 2px outset #ffffff; border-top: 2px outset #ffffff;color:#000000;}

.l-hc???????? { background-color: #cccccc; border-left: 2px outset #ffffff;color:#000000;}

.l-cc???????? { background-color: #cccccc;color:#000000; }

.l-rc???????? { background-color: #cccccc; border-right: 2px outset #ffffff;color:#000000;}

td{color:#000000;}

-->

</style>

<title>?劇ず灞??э?www.51windows.Net</title>

</head>

<!--

function restore()

{

td1.className="l";td2.className="l";td3.className="l";td4.className="l";td5.className="l";td6.className="l";

td_1.className="l-h";td_2.className="l-c";td_3.className="l-c";td_4.className="l-c";td_5.className="l-c";td_6.className="l-c";

w1.style.display="none";w2.style.display="none";w3.style.display="none";w4.style.display="none";w5.style.display="none";w6.style.display="none";

}

function c1()

{

td1.className="lc";

td_1.className="l-hc";

w1.style.display="block";

}

function c2()

{

td2.className="lc";

td_2.className="l-cc";

w2.style.display="block";

}

function c3()

{

td3.className="lc";

td_3.className="l-cc";

w3.style.display="block";

}

function c4()

{

td4.className="lc";

td_4.className="l-cc";

w4.style.display="block";

}

function c5()

{

td5.className="lc";

td_5.className="l-cc";

w5.style.display="block";

}

function c6()

{

td6.className="lc";

td_6.className="l-cc";

w6.style.display="block";

}

//-->

</SCRIPT>

? <center>

? <table cellpadding="0" cellspacing="0" width="400" height="61">

??? <tr>

????? <td width="50" height="20" align="center" valign="bottom" 慰nclick=restore();c1();><div id="td1" class="lc">????</div></td>

????? <td width="50" height="20" align="center" valign="bottom" 慰nclick=restore();c2();><div id="td2" class="l">灞?淇?</div></td>

????? <td width="50" height="20" align="center" valign="bottom" 慰nclick=restore();c3();><div id="td3" class="l">澶?瑙?</div></td>

????? <td width="50" height="20" align="center" valign="bottom" 慰nclick=restore();c4();><div id="td4" class="l">Web</div></td>

????? <td width="50" height="20" align="center" valign="bottom" 慰nclick=restore();c5();><div id="td5" class="l">????</div></td>

????? <td width="50" height="20" align="center" valign="bottom" 慰nclick=restore();c6();><div id="td6" class="l">璁劇疆</div></td>

????? <td width="50" height="20" align="center" valign="bottom" ></td>

????? <td width="50" height="20" align="center" valign="bottom"></td>

??? </tr>

??? <tr? style="">

????? <td width="50" height="1" align="center" class="l-hc" id="td_1" > </td>

????? <td width="50" height="1" align="center" class="l-c" id="td_2"> </td>

????? <td width="50" height="1" align="center" class="l-c" id="td_3"> </td>

????? <td width="50" height="1" align="center" class="l-c" id="td_4"> </td>

????? <td width="50" height="1" align="center" class="l-c" id="td_5"> </td>

????? <td width="50" height="1" align="center" class="l-c" id="td_6"> </td>

????? <td width="50" height="1" align="center" class="l-c" id="td_"> </td>

????? <td width="50" height="1" align="center" class="l-r" id="td_"> </td>

??? </tr>

??? <tr>

????? <td width="398" height="360" class="up" colspan="8" style="border-top-style: solid; border-top-width: 0; padding: 5">

??????? <p align="center">

??????? <div align="center">

????????? <table cellpadding="0" cellspacing="0" width="100%" height="325">

??????????? <tr>

????????????? <td width="100%" height="280">

????????????

???????????? <div align="center">

????????????? <center>

<div style="display:" id=w1><h1>AAAAAAAAAAAA</h1></div>

<div style="display:none" id=w2><h1>BBBBBBBBBBBBB</h1></div>

<div style="display:none" id=w3><h1>CCCCCCCCCCCCC</h1></div>

<div style="display:none" id=w4><h1>DDDDDDDDDDDD</h1></div>

<div style="display:none" id=w5><h1>EEEEEEEEEEEEEE</h1></div>

<div style="display:none" id=w6><h1>FFFFFFFFFFFFFFFFF</h1></div>

????????????? </center>

???????????? </div>

????????????

???????????? </td>

??????????? </tr>

????????? </table>

??????? </div>

????? </td>

??? </tr>

? </center>

</table>

</div>

</form>

</body>

</html>

6??

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>????棰???妗?lt;/title>

<!--

* {

??? margin: 0; padding:0

}

body {

??? margin-top: 10px;

??? margin-right: auto;

??? margin-bottom: 10px;

??? margin-left: auto;

??? text-align: center;

??? height: auto;

??? width: auto;

??? background-color: #666666;

??? font-size: 12px;

??? color: #000000;

}

#container {

??? text-align: left;

??? width: 760px;

??? height: 400px;

??? background-color: #FFFFFF;

??? padding: 20px;

}

#container #title {

??? height: 28px;

}

#container #title li {

??? float: left;

??? list-style-type: none;

??? height: 28px;

??? line-height: 28px;

??? text-align: center;

??? margin-right: 1px;

}

#container #title ul {

??? background-color: #FFFFFF;

??? height: 28px;

}

#container #title a {

??? text-decoration: none;

??? color: #000000;

??? display: block;

??? width: auto;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif) no-repeat left -29px;

}

#container #title a span{

??? display: block;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif) no-repeat right -29px;

??? padding: 0 15px 0 15px;

}

#container #title #tag1 a:hover {

??? text-decoration: none;

??? color: #ffffff;

??? display: block;

??? width: auto;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif) no-repeat left -87px;

}

#container #title #tag1 a:hover span{

??? display: block;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif) no-repeat right -87px;

??? padding: 0 15px 0 15px;

}

#container #title #tag2 a:hover {

??? text-decoration: none;

??? color: #ffffff;

??? display: block;

??? width: auto;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif) no-repeat left 0px;

}

#container #title #tag2 a:hover span{

??? display: block;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif) no-repeat right 0px;

??? padding: 0 15px 0 15px;???

}

#container #title #tag3 a:hover {

??? text-decoration: none;

??? color: #ffffff;

??? display: block;

??? width: auto;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif) no-repeat left -58px;

}

#container #title #tag3 a:hover span{

??? display: block;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif) no-repeat right -58px;

??? padding: 0 15px 0 15px;???

}

#container #title #tag4 a:hover {

??? text-decoration: none;

??? color: #ffffff;

??? display: block;

??? width: auto;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif) no-repeat left -145px;

}

#container #title #tag4 a:hover span{

??? display: block;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif) no-repeat right -145px;

??? padding: 0 15px 0 15px;

}

#container #title #tag5 a:hover {

??? text-decoration: none;

??? color: #ffffff;

??? display: block;

??? width: auto;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif) no-repeat left -174px;

}

#container #title #tag5 a:hover span{

??? display: block;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif) no-repeat right -174px;

??? padding: 0 15px 0 15px;

}

#container #title .selectli1 {

??? text-decoration: none;

??? color: #ffffff;

??? display: block;

??? width: auto;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif) no-repeat left -87px;

}

#container #title a .selectspan1 {

??? display: block;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif) no-repeat right -87px;

??? padding: 0 15px 0 15px;

}

#container #title .selectli2 {

??? text-decoration: none;

??? color: #ffffff;

??? display: block;

??? width: auto;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif) no-repeat left 0px;

}

#container #title a .selectspan2 {

??? display: block;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif) no-repeat right 0px;

??? padding: 0 15px 0 15px;

}

#container #title .selectli3 {

??? text-decoration: none;

??? color: #ffffff;

??? display: block;

??? width: auto;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif) no-repeat left -58px;

}

#container #title a .selectspan3 {

??? display: block;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif) no-repeat right -58px;

??? padding: 0 15px 0 15px;

}

#container #title .selectli4 {

??? text-decoration: none;

??? color: #ffffff;

??? display: block;

??? width: auto;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif) no-repeat left -145px;

}

#container #title a .selectspan4 {

??? display: block;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif) no-repeat right -145px;

??? padding: 0 15px 0 15px;

}

#container #title .selectli5 {

??? text-decoration: none;

??? color: #ffffff;

??? display: block;

??? width: auto;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif) no-repeat left -174px;

}

#container #title a .selectspan5 {

??? display: block;

??? background: url(http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif) no-repeat right -174px;

??? padding: 0 15px 0 15px;

}

#container #content ul {margin: 10px;}

#container #content li {margin: 5px; }

#container #content li img {margin: 5px;display:block;}

#container #content {

??? height: 300px;

??? padding: 10px;

}

.content1 {

??? border-top-width: 3px;

??? border-right-width: 1px;

??? border-bottom-width: 1px;

??? border-left-width: 1px;

??? border-top-style: solid;

??? border-right-style: solid;

??? border-bottom-style: solid;

??? border-left-style: solid;

??? border-top-color: #3A81C8;

??? border-right-color: #3A81C8;

??? border-bottom-color: #3A81C8;

??? border-left-color: #3A81C8;

??? background-color: #DFEBF7;

}

.content2 {

??? border-top-width: 3px;

??? border-right-width: 1px;

??? border-bottom-width: 1px;

??? border-left-width: 1px;

??? border-top-style: solid;

??? border-right-style: solid;

??? border-bottom-style: solid;

??? border-left-style: solid;

??? border-top-color: #ff950b;

??? border-right-color: #ff950b;

??? border-bottom-color: #ff950b;

??? border-left-color: #ff950b;

??? background-color: #FFECD2;

}

.content3 {

??? height: 300px;

??? padding: 10px;

??? border-top-width: 3px;

??? border-right-width: 1px;

??? border-bottom-width: 1px;

??? border-left-width: 1px;

??? border-top-style: solid;

??? border-right-style: solid;

??? border-bottom-style: solid;

??? border-left-style: solid;

??? border-top-color: #FE74B8;

??? border-right-color: #FE74B8;

??? border-bottom-color: #FE74B8;

??? border-left-color: #FE74B8;

??? background-color: #FFECF5;

}

.content4 {

??? height: 300px;

??? padding: 10px;

??? border-top-width: 3px;

??? border-right-width: 1px;

??? border-bottom-width: 1px;

??? border-left-width: 1px;

??? border-top-style: solid;

??? border-right-style: solid;

??? border-bottom-style: solid;

??? border-left-style: solid;

??? border-top-color: #00988B;

??? border-right-color: #00988B;

??? border-bottom-color: #00988B;

??? border-left-color: #00988B;

??? background-color: #E8FFFD;

}

.content5 {

??? height: 300px;

??? padding: 10px;

??? border-top-width: 3px;

??? border-right-width: 1px;

??? border-bottom-width: 1px;

??? border-left-width: 1px;

??? border-top-style: solid;

??? border-right-style: solid;

??? border-bottom-style: solid;

??? border-left-style: solid;

??? border-top-color: #A8BC1F;

??? border-right-color: #A8BC1F;

??? border-bottom-color: #A8BC1F;

??? border-left-color: #A8BC1F;

??? background-color: #F7FAE2;

}

.hidecontent {display:none;}

-->

</style>

function switchTag(tag,content)

{

//??? alert(tag);

//??? alert(content);

??? for(i=1; i <6; i++)

??? {

??????? if ("tag"+i==tag)

??????? {

??????????? document.getElementById(tag).getElementsByTagName("a")[0].className="selectli"+i;

??????????? document.getElementById(tag).getElementsByTagName("a")[0].getElementsByTagName("span")[0].className="selectspan"+i;

??????? }else{

??????????? document.getElementById("tag"+i).getElementsByTagName("a")[0].className="";

??????????? document.getElementById("tag"+i).getElementsByTagName("a")[0].getElementsByTagName("span")[0].className="";

??????? }

??????? if ("content"+i==content)

??????? {

??????????? document.getElementById(content).className="";

??????? }else{

??????????? document.getElementById("content"+i).className="hidecontent";

??????? }

??????? document.getElementById("content").className=content;

??? }

}

</script>

</head>

<body>

? <div id="title">

??? <ul>

????? <li id="tag1"><a href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" 慰nclick="switchTag('tag1','content1');this.blur();" class="selectli1"><span class="selectspan1">棣?椤?lt;/span></a></li>

????? <li id="tag2"><a href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" 慰nclick="switchTag('tag2','content2');this.blur();"><span>涓?杞戒腑蹇?</span></a></li>

????? <li id="tag3"><a href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" 慰nclick="switchTag('tag3','content3');this.blur();"><span>浜у??浠?缁?</span></a></li>

????? <li id="tag4"><a href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" 慰nclick="switchTag('tag4','content4');this.blur();"><span>浼???娉ㄥ??涓??誨?</span></a></li>

????? <li id="tag5"><a href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" 慰nclick="switchTag('tag5','content5');this.blur();"><span>??绯繪??浠?</span></a></li>

??? </ul>

? </div>

? <div id="content1"><p>浠挎?瀹?缃?绔???瀵艱????????姝ゆ?規?????涓?浼??癸?</p>1???規??瀛??拌????搴?椤圭???垮害</div>???

? <div id="content2" class="hidecontent">2??涓?????椤圭??浣跨?ㄤ?????棰??叉?ュ?哄??</div>

? <div id="content3" class="hidecontent">3??杩?????瑕?浣跨?ㄥ??s浜?锛??靛??lt;/div>

? <div id="content4" class="hidecontent">4???????劇??????瑕?涓や釜?劇????浠跺氨瓒沖?锛???灏????″?ㄨ???</div>

? <div id="content5" class="hidecontent">5??杩???浣跨?ㄥ?扮??涓や釜?劇??锛?

???????? <table width="58%" cellspacing="2" cellpadding="0">

?????????? <tr>

???????????? <td width="70%" align="center"><img src="http://pics.taobao.com/2k5/sys/component/tab_selected_left_bk2.gif" width="250" height="290" /></td>

???????????? <td width="30%" align="center"><img src="http://pics.taobao.com/2k5/sys/component/tab_selected_right_bk2.gif" width="15" height="290" /></td>

?????????? </tr>

???????? </table>

? </div>

</div>?

</div>

</body>

</html>

7??

<html>

<head>

<!--

.tablestyle1 {

??? font: normal 12px "瀹?浣?", Arial;

??? color: #777777;

??? text-decoration: none;

??? text-align: center;

??? vertical-align: middle;

??? border-top: 1px solid #E4E4E4;

??? border-right: 1px solid #4E4E4E;

??? border-bottom: 1px solid #4E4E4E;

??? border-left: 1px solid #E4E4E4;

??? background: #FDFDFD;

}

.Tdstyle1 {

??? background: #FDFDFD;

??? border-top: 1px solid #E6E6E6;

??? border-right: 1px solid #E6E6E6;

??? border-bottom: 1px solid #E6E6E6;

??? border-left: 1px solid #E6E6E6;

??? cursor: hand;

??? text-decoration: none;

}

.Titledivstyle {

??? text-align: justify;

??? text-justify:Distribute-all-lines;

}

.inf1 {

??? color: #EDB905;

}

.inf2 {

??? color: #107460;

}

body {

??? margin-left: 0px;

??? margin-top: 0px;

}

-->

</style>

<!--

function iniINF(Init)//?ㄧ?椤靛??濮????訛?灏???椤矽???淇℃????????杩?绋???

{

??? if(Init)

??? {

??????? inf1.style.display='none';

??????? inf2.style.display="none";

??????? inf3.style.display="none";

??????? inf4.style.display="none";

??????? inf5.style.display="none";

??????? inf6.style.display="none";

??? }

}

function showinf(theObj)//?ユ?懼苟?劇ず瀵瑰?璇??淇℃????杩?绋???

{

??? switch(theObj)

??? {

??????? case 'inf1'://褰?榧????瑰?葷????涓衡???惰?姹?娆鋸???剁??澶???杩?绋???

??????????? with(findObj(theObj))

??????????? if(style.display=='none')//妫??ュ???榧????瑰?葷????椤圭??璇??淇℃??????凡澶?浜??劇ず?舵?????ュ凡?劇ず锛????抽??锛??ユ???劇ず锛???寮瑰?恒??

??????????? {

??????????????? style.display='';

???????????????

??????????????? inf2.style.display="none";

??????????????? inf3.style.display="none";

??????????????? inf4.style.display="none";

??????????????? inf5.style.display="none";

??????????????? inf6.style.display="none";

??????????????? Menu1.style.color='#FF0000';

??????????????? Menu1.style.background='#E1F8C2';

??????????????? Menu2.style.color='';

??????????????? Menu2.style.background='';

??????????????? Menu3.style.color='';

??????????????? Menu3.style.background='';

??????????????? Menu4.style.color='';

??????????????? Menu4.style.background='';

??????????????? Menu5.style.color='';

??????????????? Menu5.style.background='';

??????????????? Menu6.style.color='';

??????????????? Menu6.style.background='';

??????????? }

??????????? else

??????????? {

??????????????? style.display='none';

??????????????????????????????????????????????????????????????????????????????? Menu1.style.color='';

??????????????? Menu1.style.background='';???????????????

??????????? }

??????????? break;

??????? case 'inf2'://褰?榧????瑰?葷????涓衡????灞?姹?娆鋸???剁??澶???杩?绋???

??????????? with(findObj(theObj))

??????????? if(style.display=='none')

??????????? {

??????????????? style.display='';

???????????????

??????????????? inf1.style.display="none";

??????????????? inf3.style.display="none";

??????????????? inf4.style.display="none";

??????????????? inf5.style.display="none";

??????????????? inf6.style.display="none";

??????????????? Menu2.style.color='#FF0000';

??????????????? Menu2.style.background='#E1F8C2';

??????????????? Menu1.style.color='';

??????????????? Menu1.style.background='';

??????????????? Menu3.style.color='';

??????????????? Menu3.style.background='';

??????????????? Menu4.style.color='';

??????????????? Menu4.style.background='';

??????????????? Menu5.style.color='';

??????????????? Menu5.style.background='';

??????????????? Menu6.style.color='';

??????????????? Menu6.style.background='';

??????????? }

??????????? else

??????????? {

??????????????? style.display='none';

???????????????

??????????????? Menu2.style.color='';

??????????????? Menu2.style.background='';

??????????? }

??????????? break;

??????? case 'inf3'://褰?榧????瑰?葷????涓衡??缃?涓???浠????剁??澶???杩?绋???

??????????? with(findObj(theObj))

??????????? if(style.display=='none')

??????????? {

??????????????? style.display='';

???????????????

??????????????? inf2.style.display="none";

??????????????? inf1.style.display="none";

??????????????? inf4.style.display="none";

??????????????? inf5.style.display="none";

??????????????? inf6.style.display="none";

??????????????? Menu3.style.color='#FF0000';

??????????????? Menu3.style.background='#E1F8C2';

??????????????? Menu2.style.color='';

??????????????? Menu2.style.background='';

??????????????? Menu1.style.color='';

??????????????? Menu1.style.background='';

??????????????? Menu4.style.color='';

??????????????? Menu4.style.background='';

??????????????? Menu5.style.color='';

??????????????? Menu5.style.background='';

??????????????? Menu6.style.color='';

??????????????? Menu6.style.background='';

??????????? }

??????????? else

??????????? {

??????????????? style.display='none';

???????????????

??????????????? Menu3.style.color='';

??????????????? Menu3.style.background='';

??????????? }

??????????? break;

??????? case 'inf4'://褰?榧????瑰?葷????涓衡???佃?????尖???剁??澶???杩?绋???

??????????? with(findObj(theObj))

??????????? if(style.display=='none')

??????????? {

??????????????? style.display='';

???????????????

??????????????? inf2.style.display="none";

??????????????? inf3.style.display="none";

??????????????? inf1.style.display="none";

??????????????? inf5.style.display="none";

??????????????? inf6.style.display="none";

??????????????? Menu4.style.color='#FF0000';

??????????????? Menu4.style.background='#E1F8C2';

??????????????? Menu2.style.color='';

??????????????? Menu2.style.background='';

??????????????? Menu3.style.color='';

??????????????? Menu3.style.background='';

??????????????? Menu1.style.color='';

??????????????? Menu1.style.background='';

??????????????? Menu5.style.color='';

??????????????? Menu5.style.background='';

??????????????? Menu6.style.color='';

??????????????? Menu6.style.background='';

??????????? }

??????????? else

??????????? {

??????????????? style.display='none';

???????????????

??????????????? Menu4.style.color='';

??????????????? Menu4.style.background='';

??????????? }

??????????? break;

??????? case 'inf5'://褰?榧????瑰?葷????涓衡?????哄???尖???剁??澶???杩?绋???

??????????? with(findObj(theObj))

??????????? if(style.display=='none')

??????????? {

??????????????? style.display='';

???????????????

??????????????? inf2.style.display="none";

??????????????? inf3.style.display="none";

??????????????? inf4.style.display="none";

??????????????? inf1.style.display="none";

??????????????? inf6.style.display="none";

??????????????? Menu5.style.color='#FF0000';

??????????????? Menu5.style.background='#E1F8C2';

??????????????? Menu2.style.color='';

??????????????? Menu2.style.background='';

??????????????? Menu3.style.color='';

??????????????? Menu3.style.background='';

??????????????? Menu4.style.color='';

??????????????? Menu4.style.background='';

??????????????? Menu1.style.color='';

??????????????? Menu1.style.background='';

??????????????? Menu6.style.color='';

??????????????? Menu6.style.background='';

??????????? }

??????????? else

??????????? {

??????????????? style.display='none';

???????????????

??????????????? Menu5.style.color='';

??????????????? Menu5.style.background='';

??????????? }

??????????? break;

??????? case 'inf6'://褰?榧????瑰?葷????涓衡??U甯??″???尖???剁??澶???杩?绋???

??????????? with(findObj(theObj))

??????????? if(style.display=='none')

??????????? {

??????????????? style.display='';

???????????????

??????????????? inf2.style.display="none";

??????????????? inf3.style.display="none";

??????????????? inf4.style.display="none";

??????????????? inf5.style.display="none";

??????????????? inf1.style.display="none";

??????????????? Menu6.style.color='#FF0000';

??????????????? Menu6.style.background='#E1F8C2';

??????????????? Menu2.style.color='';

??????????????? Menu2.style.background='';

??????????????? Menu3.style.color='';

??????????????? Menu3.style.background='';

??????????????? Menu4.style.color='';

??????????????? Menu4.style.background='';

??????????????? Menu5.style.color='';

??????????????? Menu5.style.background='';

??????????????? Menu1.style.color='';

??????????????? Menu1.style.background='';

??????????? }

??????????? else

??????????? {

??????????????? style.display='none';

???????????????

??????????????? Menu6.style.color='';

??????????????? Menu6.style.background='';

??????????? }

??????????? break;

??? }

}

// Example: obj = findObj("image1");

function findObj(theObj, theDoc)//?ユ?懼?矽薄?芥?般??

{

? var p, i, foundObj;

? if(!theDoc) theDoc = document;

? if( (p = theObj.indexOf("?")) > 0 && parent.frames.length)

? {

??? theDoc = parent.frames[theObj.substring(p+1)].document;

??? theObj = theObj.substring(0,p);

? }

? if(!(foundObj = theDoc[theObj]) && theDoc.all) foundObj = theDoc.all[theObj];

? for (i=0; !foundObj && i < theDoc.forms.length; i++)

??? foundObj = theDoc.forms[i][theObj];

? for(i=0; !foundObj && theDoc.layers && i < theDoc.layers.length; i++)

??? foundObj = findObj(theObj,theDoc.layers[i].document);

? if(!foundObj && document.getElementById) foundObj = document.getElementById(theObj);

? return foundObj;

}

function MM_findObj(n, d) { //v4.01

? var p,i,x;? if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {

??? d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}

? if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];

? for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);

? if(!x && d.getElementById) x=d.getElementById(n); return x;

}

//-->

</script>

</head>

? <tr>

??? <td align="center" valign="middle"><table width="480" cellpadding="0" cellspacing="0" class="tablestyle1">

????? <tr>

??????? <td><table width="100%"? cellspacing="0" cellpadding="0" class="Tdstyle1">

????????? <tr>

??????????? <td id=Menu1 width="80" height="20" align="center" onMouseUp="showinf('inf1')">?惰?姹?娆?lt;/td>

??????????? <td id=Menu2 width="80" align="center" onMouseUp="showinf('inf2')">??灞?姹?娆?lt;/td>

??????????? <td id=Menu3 width="80" align="center" onMouseUp="showinf('inf3')">缃?涓???浠?</td>

??????????? <td id=Menu4 width="80" align="center" onMouseUp="showinf('inf4')">?佃??????lt;/td>

??????????? <td id=Menu5 width="80" align="center" onMouseUp="showinf('inf5')">???哄????lt;/td>

??????????? <td id=Menu6 width="80" align="center" onMouseUp="showinf('inf6')">U甯??″????lt;/td>

????????? </tr>

??????? </table></td>

????? </tr>

????? <tr>

??????? <td height="200" valign="top" id="inf1"><table width="90%" height="100%"? cellpadding="0" cellspacing="0">

????????? <tr>

??????????? <td height="200" valign="middle"><table width="100%"? cellpadding="0" cellspacing="0" class="inf1">

????????????? <tr>

??????????????? <td height="20"><div align="justify">姹?娆句俊??锛?</div></td>

????????????? </tr>

????????????? <tr>

??????????????? <td height="20">?</td>

????????????? </tr>

????????????? <tr>

??????????????? <td height="20"><table width="100%"? cellspacing="0" cellpadding="0">

????????????????? <tr>

??????????????????? <td width="70" class="Titledivstyle">寮?

????????????????????? ????琛?</td>

??????????????????? <td width="360"><div align="left">锛?娣卞?沖???涓??惰?XXX??琛?</div></td>

????????????????? </tr>

??????????????? </table></td>

????????????? </tr>

????????????? <tr>

??????????????? <td height="20"><table width="100%"? cellspacing="0" cellpadding="0">

????????????????? <tr>

??????????????????? <td width="70" class="Titledivstyle">甯?

???????????????????? ? ?仿? ??</td>

??????????????????? <td><div align="left">锛?娣卞?沖?XXXXXXXXX????????lt;/div></td>

????????????????? </tr>

??????????????? </table></td>

????????????? </tr>

????????????? <tr>

??????????????? <td height="20"><table width="100%"? cellspacing="0" cellpadding="0">

????????????????? <tr>

??????????????????? <td width="70" class="Titledivstyle">甯?

???????????????????? ????? ??lt;/td>

??????????????????? <td><div align="left">锛?2326 5665 5669 2233 xxxx

??????????????????????? xxxx</div></td>

????????????????? </tr>

??????????????? </table></td>

????????????? </tr>

????????????? <tr>

??????????????? <td height="20">?</td>

????????????? </tr>

????????????? <tr>

??????????????? <td height="20"><div align="justify">寤鴻??澶у?跺?ㄩ?惰?姹?娆炬?垛????lt;/div></td>

????????????? </tr>

??????????? </table></td>

????????? </tr>

??????? </table></td>

????? </tr>

????? <tr>

??????? <td height="200" valign="top" id="inf2"><table width="90%" height="100%"? cellpadding="0" cellspacing="0">

????????? <tr>

??????????? <td height="200"><table width="100%"? cellpadding="0" cellspacing="0" class="inf2">

????????????? <tr>

??????????????? <td height="20"><div align="justify">姹?娆句俊??锛?</div></td>

????????????? </tr>

????????????? <tr>

??????????????? <td height="20">?</td>

????????????? </tr>

????????????? <tr>

??????????????? <td height="20"><table width="100%"? cellspacing="0" cellpadding="0">

??????????????????? <tr>

????????????????????? <td width="70" class="Titledivstyle1">??

??????????????????????? 璁? ????</td>

????????????????????? <td width="360"><div align="left">锛?娣卞?沖?????lt;/div></td>

??????????????????? </tr>

??????????????? </table></td>

????????????? </tr>

????????????? <tr>

??????????????? <td height="20"><table width="100%"? cellspacing="0" cellpadding="0">

??????????????????? <tr>

????????????????????? <td width="70" class="Titledivstyle">???????????????????????? ? 娆韭? 浜?lt;/td>

????????????????????? <td><div align="left">锛?娣卞?沖?XXXXXXXXX????????lt;/div></td>

??????????????????? </tr>

??????????????? </table></td>

????????????? </tr>

????????????? <tr>

??????????????? <td height="20"><table width="100%"? cellspacing="0" cellpadding="0">

??????????????????? <tr>

????????????????????? <td width="70" class="Titledivstyle">???????? 缂? </td>

????????????????????? <td><div align="left">锛?xxxxxx</div></td>

??????????????????? </tr>

??????????????? </table></td>

????????????? </tr>

????????????? <tr>

??????????????? <td height="20">?</td>

????????????? </tr>

????????????? <tr>

??????????????? <td height="20"><div align="justify">寤鴻??澶у?跺?ㄩ??灞?姹?娆炬?垛????lt;/div></td>

????????????? </tr>

??????????? </table></td>

????????? </tr>

??????? </table></td>

????? </tr>

????? <tr>

??????? <td height="200" valign="top" id="inf3"><table width="90%" height="100%"? cellpadding="0" cellspacing="0">

????????? <tr>

??????????? <td height="200" valign="middle">杩???<font color="#FD5A02">??缃?涓???浠???</font>??淇℃????</td>

????????? </tr>

??????? </table></td>

????? </tr>

????? <tr>

??????? <td height="200" valign="top" id="inf4"><table width="90%" height="100%"? cellpadding="0" cellspacing="0">

????????? <tr>

??????????? <td height="200" valign="middle">杩???<font color="#3C8FEC">???佃?????尖??</font>??淇℃????</td>

????????? </tr>

??????? </table></td>

????? </tr>

????? <tr>

??????? <td height="200" valign="top" id="inf5"><table width="90%" height="100%"? cellpadding="0" cellspacing="0">

????????? <tr>

??????????? <td height="200" valign="middle">杩???<font color="#9E3CE8">?????哄???尖??</font>??淇℃????</td>

????????? </tr>

??????? </table></td>

????? </tr>

????? <tr>

??????? <td height="200" valign="top" id="inf6"><table width="90%" height="100%"? cellpadding="0" cellspacing="0">

????????? <tr>

??????????? <td height="200" valign="middle">杩???<font color="#62A70E">??U甯??″???尖??</font>??淇℃????</td>

????????? </tr>

??????? </table></td>

????? </tr>

??? </table>

??? </td>

? </tr>

</table>

</div></center>

</body></html>

8??

<style>

body {font-size:12px;font-family:瀹?浣?}

ul.TabBarLevel1{

??? list-style:none;

??? margin:0;

??? padding:0;

??? height:29px;

??? background-image:url(http://pics.taobao.com/2k5/sys/component/tabbar_level1_bk.gif);

}

ul.TabBarLevel1 li{

??? float:left;

??? padding:0;

??? height:29px;

??? margin-right:1px;

??? background:url(http://pics.taobao.com/2k5/sys/component/tabbar_level1_slice_left_bk.gif) left top no-repeat;

}

ul.TabBarLevel1 li a{

??? display:block;

??? line-height:29px;

??? padding:0 20px;

??? color:#333;

??? background:url(http://pics.taobao.com/2k5/sys/component/tabbar_level1_slice_right_bk.gif) right top no-repeat;

??? white-space: nowrap;

}

ul.TabBarLevel1 li.Selected{

??? background:url(http://pics.taobao.com/2k5/sys/component/tabbar_level1_slice_selected_left_bk.gif) left top no-repeat;

}

ul.TabBarLevel1 li.Selected a{

??? background:url(http://pics.taobao.com/2k5/sys/component/tabbar_level1_slice_selected_right_bk.gif) right top no-repeat;

}

ul.TabBarLevel1 li a:link,ul.TabBarLevel1 li a:visited{

??? color:#333;

}

ul.TabBarLevel1 li a:hover,ul.TabBarLevel1 li a:active{

??? color:#F30;

??? text-decoration:none;

}

ul.TabBarLevel1 li.Selected a:link,ul.TabBarLevel1 li.Selected a:visited{

??? color:#000;

}

ul.TabBarLevel1 li.Selected a:hover,ul.TabBarLevel1 li.Selected a:active{

??? color:#F30;

??? text-decoration:none;

}

div.HackBox {

? padding : 2px 2px ;

? border-left: 2px solid #6697CD;

? border-right: 2px solid #6697CD;

? border-bottom: 2px solid #6697CD;

? display:none;

}

</style>

??? <ul class="TabBarLevel1" id="TabPage1">

??????? <li id="Tab1"><a href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" 慰nclick="javascript:switchTab('TabPage1','Tab1');">瀛???涔???</a></li>

??????? <li? id="Tab2" class="Selected"><a href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" 慰nclick="javascript:switchTab('TabPage1','Tab2');">??缈???娴?lt;/a></li>

??????? <li? id="Tab3"><a href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" 慰nclick="javascript:switchTab('TabPage1','Tab3');"><B><font color="#22FF22">??lt;/font><font color="#FF2222">寰?</font><font color="#001199">瑙?</font><font color="#00fffa">??lt;/font></B></a></li>

??????? <li? id="Tab4"><a href="#" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" target="_blank" rel="external nofollow" 慰nclick="javascript:switchTab('TabPage1','Tab4');">??澶?浣?璋?</a></li>

??? </ul>

??? <div id="cnt">

??? <div id="dTab1" class="HackBox">??涓烘??涓?娆＄??蹇?涔?????娉ｏ???涓烘??涓?娆＄???蹭激??寰?绗???

??? </div>

??? <div id="dTab2" class="HackBox" style="display:block">???誨?＄??跨簿??灞??彙??

??? </div>

??? <div id="dTab3" class="HackBox">瀛????浠跺ご?肩??浜?锛?涓轟??芥椿涓??繪??涓?寰?涓?瀛??

??? </div>

??? <div id="dTab4" class="HackBox">浠??舵?ｅ敖瀵???涓???瀹?姝? 寰?甯??????? 瀵?瀵?娌?娲叉??璇ユ??蹇佃?

??? </div>

</div>

//Switch Tab Effect

function switchTab(tabpage,tabid){

??????? var oItem = document.getElementById(tabpage);??

??? for(var i=0;i<oItem.children.length;i++){

??????? var x = oItem.children(i);???

??????? x.className = "";

??????? var y = x.getElementsByTagName('a');

??????? y[0].style.color="#333333";

??? }???

??? document.getElementById(tabid).className = "Selected";

??? var dvs=document.getElementById("cnt").getElementsByTagName("div");

??? for (var i=0;i<dvs.length;i++){

????? if (dvs[i].id==('d'+tabid))

??????? dvs[i].style.display='block';

????? else

??????? dvs[i].style.display='none';

??? }

}

</script>

9??

<html>

<head>

<style>

td,a,body{font-size:9pt;}

.DivAround_focus{cursor:pointer;background-color:#A1ACDB;border-right:solid 1px #A1ACDB;border-bottom:solid 1px #333333; border-left:solid 1px #C8CEEA;? border-top:solid 1px #C8CEEA;color:#000000}

.DivAround_blur{cursor:pointer;background:#4D5C9F;border-right:solid 1px #eeeeee;border-bottom:solid 1px #333333; border-left:solid 1px #798ACC;? border-top:solid 1px #A1ACDB;color:#FFFFFF}

.DivAround_content{background-color:#A1ACDB;border-right:solid 1px #888888;border-bottom:solid 1px #555555; border-left:0px; border-top:solid 1px #C8CEEA;}

</style>

</head>

var AroundInfoArray=new Array();

AroundInfoArray[0]="???″??????瀹?;

AroundInfoArray[1]="瀛??＄????瀹?;

AroundInfoArray[2]="??搴?????瀹?;

function ChangeFocus(obj)

{

for(i=0;i<document.getElementById("leftButtonTAble").rows.length;i++)

{

??? if(document.getElementById("leftButtonTAble").rows[i].cells[0]==obj)

??? {

??????? document.getElementById("leftButtonTAble").rows[i].cells[0].className="DivAround_focus";

??????? document.getElementById("DivAroundContent").innerHTML=AroundInfoArray[i];

??? }else{

??????? document.getElementById("leftButtonTAble").rows[i].cells[0].className="DivAround_blur";

??? }

}

</script>

??????????? <table cellpadding="0" cellspacing="0" height="407" width="84" id="leftButtonTAble">

??????????????? <tr><td height="25" align="center" class="DivAround_focus" onClick="ChangeFocus(this)">???″??</td></tr>

??????????????? <tr><td height="25" align="center" class="DivAround_blur" onClick="ChangeFocus(this)">瀛???lt;/td></tr>

??????????????? <tr><td height="25" align="center" class="DivAround_blur" onClick="ChangeFocus(this)">??搴?</td></tr>

??????????????? <tr><td style="border-right:solid 1px #eeeeee">?</td></tr>

??????????? </table>

??????? </td><td width="360">

??????????? <table cellpadding="0" cellspacing="0" width="100%" class="DivAround_content">

??????????????? <tr><td height="406" valign="top" style="padding:4px" id="DivAroundContent">??瀹?lt;/td></tr>

??????????? </table>

??????? </td></tr>

??????? </table>

??????? <script language="javascript">ChangeFocus(document.getElementById("leftButtonTAble").rows[0].cells[0]);</script>

</body></html>

仿windows頁籤-1

繼續閱讀

Small tricks

debian9更新4.9.0核心到4.19.2核心過程

Javascript建構Bingo卡片遊戲

JavaScript的那些坑之事件代理事件代理事件階段

javascript的for (var i in data)慎用javascript中的for (var i in data)謹慎用

Windows下配置Apache的SSL服務

Mac｜Windows系統本地照片自動上傳到伺服器

tab滑鼠經過菜單切換

vue （vue2.0）使用總結(從大體結構總結)

無元件上傳圖檔到資料庫中，最完整解決方案

vue搭建過程及出現問題

/\B(?=(?:\d{3})+$)/g 一條令人費解的正規表達式

适用于JavaScript的ECMAScript 2020規範向前發展

JS生成uuid的四種方法

layui多任務上傳添加進度條