选项卡具有占用篇幅小,辐射内容大的特点。 这里所说的选项卡效果是要在Web页面实现的,并非应用程序里的菜单选项,在网页中应用选项卡可以使网页显得更紧凑,结合AJAX技术可以使页面在有限的空间内展现更多的内容。
  以下是引用片段:
   
  body {
  margin:0px;
  text-align:center;
  font-size:12px;
  }
  #divall {
  margin:auto;
  margin-top:35px;
  width:300px;
  
  background-color:#7DA7D9;
  border:0px;
  }
  #title {
  width:300px;
  
  font-size:14px;
  margin-top:4px;
  }
  #table1 table {
  width:300px;
  
  font-size:12px;
  }
  #table2 table {
  width:300px;
  
  font-size:12px;
  }
  #content1,#content2,#content3,#content4,#content5,#content6,#msg1,#msg2 {
  margin:auto;
  
  width:290px;
  background-color:#eee;
  position:relative;
  }
  #content1 div,#content2 div,#content3 div,#content4 div,#content5 div,#content6 div {
  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;
  }
  
  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"
  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"
  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(){
  document.getElementById("content1").style.display="none"
  document.getElementById("content2").style.display="none"
  document.getElementById("content3").style.display="none"
  document.getElementById("content4").style.display="none"
  document.getElementById("content5").style.display="block"
  document.getElementById("content6").style.display="none"
  }
  function aa6(){
  document.getElementById("content1").style.display="none"
  document.getElementById("content2").style.display="none"
  document.getElementById("content3").style.display="none"
  document.getElementById("content4").style.display="none"
  document.getElementById("content5").style.display="none"
  document.getElementById("content6").style.display="block"
  }
  分类类型
  游戏下载
  游戏下载
  游戏下载
  第一个里面的内容关闭
  第二个里面的内容关闭
  第三个里面的内容关闭
  没有选择类型
  游戏下载
  游戏下载
  游戏下载
  第四个里面的内容关闭
  第五个里面的内容关闭
  第六个里面的内容关闭
  没有选择类型
   文章主要介绍一种简洁的选项卡效果的实现,兼容性较好,方便大家直接使用。虽然我是做电话录音卡相关软件编程的,但是,我对这些的知识也是非常喜欢,业余爱好手,也可以称发烧友。呵呵!
  文章由精油录入