网页制作中分类的选项卡特效代码

选项卡原身是Windows操作系统的一个创意，即通过交换选项，让很多项目信息轮替显示在大小和位置都固定的小块区域里。因此选项卡具有占用篇幅小，辐射内容大的特点。一个典型的例子是你打开IE浏览器，依次点击“工具”-“Internet选项”，这个表单就是一个选项卡典型布局。当然了，这里所说的选项卡效果是要在Web页面实现的，并非应用程序里的菜单选项，在网页中应用选项卡可以使网页显得更紧凑，结合AJAX技术可以使页面在有限的空间内展现更多的内容。本文主要介绍一种简洁的选项卡效果的实现，兼容性较好，方便大家直接使用。 字串8

以下是引用片段：
<style type="text/css">
body {
 margin:0px;
 text-align:center;
 font-size:12px;
}
#divall {
 margin:auto;
 margin-top:35px;
 width:300px;
 height:200px;
 background-color:#7DA7D9;
 border:0px;
}
#title {
 width:300px;
 height:20px;
 font-size:14px;
 margin-top:4px;
}
#table1 table {
 width:300px;
 height:30px;
 font-size:12px;
}
#table2 table {
 width:300px;
 height:30px;
 font-size:12px;
}
#content1,#content2,#content3,#content4,#content5,#content6,#msg1,#msg2 {
 margin:auto;
 height:110px;
 width:290px;
 background-color:#eee;
 position:relative;
}
#content1 div,#content2 div,#content3 div,#content4 div,#content5 div,#content6 div { 字串4
 position:absolute;
 bottom:3px;
 right:3px; 
                cursor:pointer;
}
a {
 text-decoration:none;
}
.changebordercolor {
 border-top:1px solid #369;
 border-left:1px solid #369;
}
.backbordercolor {
 border:0px solid red;
}
</style>
<script language="javascript">
function msg(){
 document.getElementById("msg1").style.display="none"
 document.getElementById("msg2").style.display="none"
}
function msgnone(ms,cont){
 document.getElementById(ms).style.display='block'
 document.getElementById(cont).style.display='none'
}
function aa1(){
 document.getElementById("content1").style.display="block"
 document.getElementById("content2").style.display="none" 字串4
 document.getElementById("content3").style.display="none"
 document.getElementById("content4").style.display="none"
 document.getElementById("content5").style.display="none"
 document.getElementById("content6").style.display="none"
}
function aa2(){
 document.getElementById("content1").style.display="none"
 document.getElementById("content2").style.display="block"
 document.getElementById("content3").style.display="none"
 document.getElementById("content4").style.display="none"
 document.getElementById("content5").style.display="none"
 document.getElementById("content6").style.display="none"
}
function aa3(){
 document.getElementById("content1").style.display="none" 字串6
 document.getElementById("content2").style.display="none"
 document.getElementById("content3").style.display="block"
 document.getElementById("content4").style.display="none"
 document.getElementById("content5").style.display="none"
 document.getElementById("content6").style.display="none"
}
function aa4(){
 document.getElementById("content1").style.display="none"
 document.getElementById("content2").style.display="none"
 document.getElementById("content3").style.display="none"
 document.getElementById("content4").style.display="block"
 document.getElementById("content5").style.display="none"
 document.getElementById("content6").style.display="none"
}
function aa5(){

字串6