仿windows选项卡效果拾零

  • 作者:marvellous 来源:蓝色理想 文章点击数:

<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>
<!--Javascript部分-->
            <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>
<p align="center">
<!--HTML部分-->
            <TABLE id=secTable cellSpacing=0 cellPadding=0 width=549 border=0>
              <TBODY>
              <TR align=middle height=20>
    <TD class=sec2 onclick=secBoard(0) width="10%">1</TD>
    <TD class=sec1 onclick=secBoard(1) width="10%">2</TD>
    <TD class=sec1 onclick=secBoard(2) width="10%">3</TD>
    <TD class=sec1 onclick=secBoard(3)
              width="10%">4</TD>
  </TR></TBODY></TABLE>
            <TABLE class=main_tab id=mainTable height=240 cellSpacing=0
            cellPadding=0 width=549 border=0><!--关于TBODY标记-->
              <TBODY style="DISPLAY: block">
              <TR>
                <TD vAlign=top align=middle><BR><BR>
                  <TABLE cellSpacing=0 cellPadding=0 width=490 border=0>
                    <TBODY>
                    <TR>
          <TD><center><img src="tutu16.gif"><BR>
<table><tr><td style="width:80;height:20;background-color:blue" onmouseover="this.style.backgroundColor='red'" onmouseout="this.style.backgroundColor='blue'"></td></tr></table>
<BR></TD></TR></TBODY></TABLE></TD></TR></TBODY><!--关于cells集合-->
              <TBODY style="DISPLAY: none">
              <TR>
                <TD vAlign=top align=middle><BR><BR>
                  <TABLE cellSpacing=0 cellPadding=0 width=490 border=0>
                    <TBODY>
                    <TR>
          <TD><center><img src="tutu24.gif"><BR>
<form name="form1" method="post" action="">
  <select name="select" style="background:#FF0000;color:white">
    <option >凤,风之羽也。</option>
    <option>ddddddddddddd</option>
    <option>ddddddddddddddddd</option>
    <option>eeeeeeeeeeeeeeee</option>
    <option>eeeeeeeeeeeeeeee</option>
  </select>
</form>        
</TD></TR></TBODY></TABLE></TD></TR></TBODY><!--关于tBodies集合-->
              <TBODY style="DISPLAY: none">
              <TR>
                <TD vAlign=top align=middle><BR><BR>
                  <TABLE cellSpacing=0 cellPadding=0 width=490 border=0>
                    <TBODY>
                    <TR>
        <TD><center><img src="tutu30.gif"><BR>
<style type="text/css">
<!--
.formstyle { font-family: "宋体"; font-size: 10pt; color: #FF0000; background-color: #FFFFCC}
-->
</style>
<center>
<form name="form1" method="post" action="">
<select name="select" class="formstyle">
<option value="a1.html">menu1</option>
<option value="a4.html" selected>menu2</option>
<option value="a8.html">menu3</option>
</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 border=0>
                    <TBODY>
                    <TR>
          <TD><center><img src="tutu34.gif"><br>
<table border="0" cellpadding="3" cellspacing="1" bgcolor="#000000">
  <tr>
    <a href="a12.html"><td bgcolor="#FFFFFF" onMouseOver="this.style.color='#ffffff'; this.style.background='#003399'" onMouseOut="this.style.color='#003399'; this.style.background='#ffffff'" style="cursor: hand">恰在似与不似之间</td></a>
  </tr>
</table>
</TD>
        </TR></TBODY></TABLE></TD></TR></TBODY></TABLE></p>

上一页      下一页
本文共 4 页,第  [1]  [2]  [3]  [4]  页

Tags:windows 选项卡 特效
  • 相关文章

Copyright 2006-2008 Powered by Noheart.NET无心人网络 All Rights Reserved.

QQ:89232083 E-Mail:leijian212@163.com

豫ICP备08004854号