Tab菜单
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>内容导航的菜单效果</title>
</head>
<body>
<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: #FFFFF;
}
</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>
<!--HTML部分-->
<TABLE id=secTable cellSpacing=0 cellPadding=0 width=549 border=0>
<TBODY>
<TR align=center height=20>
<TD class=sec2 onclick=secBoard(0) width="10%">标题一</TD>
<TD class=sec1 onclick=secBoard(1) width="10%">标题二</TD>
<TD class=sec1 onclick=secBoard(2) width="10%">标题三</TD>
<TD class=sec1 onclick=secBoard(3) width="10%">标题四</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=center><BR><BR>
<TABLE cellSpacing=0 cellPadding=0 width=490 border=0>
<TBODY>
<TR>
<TD>
内容一，<a href="www.qipao8.com">可以带链接</a><br>
内容一，<a href="www.qipao8.com">可以带链接</a><br>
内容一，<a href="www.qipao8.com">可以带链接</a><br>
内容一，<a href="www.qipao8.com">可以带链接</a><br>
<BR><BR></TD></TR></TBODY></TABLE></TD></TR></TBODY>
<!-- 2 -->
<TBODY style="DISPLAY: none">
<TR>
<TD vAlign=top align=center><BR><BR>
<TABLE cellSpacing=0 cellPadding=0 width=490 border=0>
<TBODY>
<TR>
<TD>
内容二，<a href="www.qipao8.com">可以带链接</a><br>
内容二，<a href="www.qipao8.com">可以带链接</a><br>
内容二，<a href="www.qipao8.com">可以带链接</a><br>
内容二，<a href="www.qipao8.com">可以带链接</a><br>
<BR><BR></TD></TR></TBODY></TABLE></TD></TR></TBODY>
<!-- 3 -->
<TBODY style="DISPLAY:none">
<TR>
<TD vAlign=top align=center><BR><BR>
<TABLE cellSpacing=0 cellPadding=0 width=490 border=0>
<TBODY>
<TR>
<TD>
内容三，<a href="www.qipao8.com">可以带链接</a><br>
内容三，<a href="www.qipao8.com">可以带链接</a><br>
内容三，<a href="www.qipao8.com">可以带链接</a><br>
内容三，<a href="www.qipao8.com">可以带链接</a><br>
<BR><BR></TD></TR></TBODY></TABLE></TD></TR></TBODY>
<!-- 4 -->
<TBODY style="DISPLAY:none">
<TR>
<TD vAlign=top align=center><BR><BR>
<TABLE cellSpacing=0 cellPadding=0 width=490 border=0>
<TBODY>
<TR>
<TD>
内容四，<a href="www.qipao8.com">可以带链接</a><br>
内容四，<a href="www.qipao8.com">可以带链接</a><br>
内容四，<a href="www.qipao8.com">可以带链接</a><br>
内容四，<a href="www.qipao8.com">可以带链接</a><br>
<BR><BR></TD></TR></TBODY></TABLE></TD></TR></TBODY>
</TABLE>
</body>
</html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>内容导航的菜单效果</title>
</head>
<body>
<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: #FFFFF;
}
</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>
<!--HTML部分-->
<TABLE id=secTable cellSpacing=0 cellPadding=0 width=549 border=0>
<TBODY>
<TR align=center height=20>
<TD class=sec2 onclick=secBoard(0) width="10%">标题一</TD>
<TD class=sec1 onclick=secBoard(1) width="10%">标题二</TD>
<TD class=sec1 onclick=secBoard(2) width="10%">标题三</TD>
<TD class=sec1 onclick=secBoard(3) width="10%">标题四</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=center><BR><BR>
<TABLE cellSpacing=0 cellPadding=0 width=490 border=0>
<TBODY>
<TR>
<TD>
内容一，<a href="www.qipao8.com">可以带链接</a><br>
内容一，<a href="www.qipao8.com">可以带链接</a><br>
内容一，<a href="www.qipao8.com">可以带链接</a><br>
内容一，<a href="www.qipao8.com">可以带链接</a><br>
<BR><BR></TD></TR></TBODY></TABLE></TD></TR></TBODY>
<!-- 2 -->
<TBODY style="DISPLAY: none">
<TR>
<TD vAlign=top align=center><BR><BR>
<TABLE cellSpacing=0 cellPadding=0 width=490 border=0>
<TBODY>
<TR>
<TD>
内容二，<a href="www.qipao8.com">可以带链接</a><br>
内容二，<a href="www.qipao8.com">可以带链接</a><br>
内容二，<a href="www.qipao8.com">可以带链接</a><br>
内容二，<a href="www.qipao8.com">可以带链接</a><br>
<BR><BR></TD></TR></TBODY></TABLE></TD></TR></TBODY>
<!-- 3 -->
<TBODY style="DISPLAY:none">
<TR>
<TD vAlign=top align=center><BR><BR>
<TABLE cellSpacing=0 cellPadding=0 width=490 border=0>
<TBODY>
<TR>
<TD>
内容三，<a href="www.qipao8.com">可以带链接</a><br>
内容三，<a href="www.qipao8.com">可以带链接</a><br>
内容三，<a href="www.qipao8.com">可以带链接</a><br>
内容三，<a href="www.qipao8.com">可以带链接</a><br>
<BR><BR></TD></TR></TBODY></TABLE></TD></TR></TBODY>
<!-- 4 -->
<TBODY style="DISPLAY:none">
<TR>
<TD vAlign=top align=center><BR><BR>
<TABLE cellSpacing=0 cellPadding=0 width=490 border=0>
<TBODY>
<TR>
<TD>
内容四，<a href="www.qipao8.com">可以带链接</a><br>
内容四，<a href="www.qipao8.com">可以带链接</a><br>
内容四，<a href="www.qipao8.com">可以带链接</a><br>
内容四，<a href="www.qipao8.com">可以带链接</a><br>
<BR><BR></TD></TR></TBODY></TABLE></TD></TR></TBODY>
</TABLE>
</body>
</html>
浙公网安备 33010602011771号