<html>
<head>
<title><title>
<meta;charset=gb2312">
<styletype="text/css">
<!--
*
html,body
UL
/*標準盒模型*/
.ttl
.ctt
.w936
/*TAB切換效果*/
.tb_
.tb_ul
.tb_li
/*用於控制顯示與隱藏的css類*/
.normaltab
.hovertab
.dis
.undis
-->
</style>
<scripttype="text/javascript"language="javascript">
//<!CDATA[
functiong(o)
functionHoverLi(n){
//如果有N個標簽，就將i<=N;
//本功能非常OK，兼容IE7、FF、IE6;
for(vari=1;i<=6;i++)g('tbc_0'+n).className='dis';g('tb_'+n).className='hovertab';
}
<!--如果要做成點擊後再轉到請將<li>中的onmouseover改成onclick-->
</script>
</head>
<body>
<divclass="w936">
<divid="tb_"class="tb_">
<ul>
<liid="tb_1"class="hovertab"onMouseOver="x:HoverLi(1);">
1</li>
<liid="tb_2"class="normaltab"onMouseOver="i:HoverLi(2);">
2</li>
<liid="tb_3"class="normaltab"onMouseOver="a:HoverLi(3);">
3</li>
<liid="tb_4"class="normaltab"onMouseOver="o:HoverLi(4);">
4</li>
<liid="tb_5"class="normaltab"onMouseOver="g:HoverLi(5);">
5</li>
<liid="tb_6"class="normaltab"onMouseOver="z:HoverLi(6);">
6</li>
</ul>
</div>
<divclass="ctt">
<divclass="dis"id="tbc_01">1</div>
<divclass="undis"id="tbc_02">2</div>
<divclass="undis"id="tbc_03">3</div>
<divclass="undis"id="tbc_04">4</div>
<divclass="undis"id="tbc_05">5</div>
<divclass="undis"id="tbc_06">6</div>
</div>
</div>
</div>
</body>
</html>
寬高和美化的樣式自己研究壹下吧！