選項卡具有占用篇幅小，輻射內(nèi)容大的特點。 這里所說的選項卡效果是要在Web頁面實現(xiàn)的，并非應(yīng)用程序里的菜單選項，在網(wǎng)頁中應(yīng)用選項卡可以使網(wǎng)頁顯得更緊湊，結(jié)合AJAX技術(shù)可以使頁面在有限的空間內(nèi)展現(xiàn)更多的內(nèi)容。
以下是引用片段：
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 {
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"
}
分類類型
游戲下載
游戲下載
游戲下載
第一個里面的內(nèi)容關(guān)閉
第二個里面的內(nèi)容關(guān)閉
第三個里面的內(nèi)容關(guān)閉
沒有選擇類型
游戲下載
游戲下載
游戲下載
第四個里面的內(nèi)容關(guān)閉
第五個里面的內(nèi)容關(guān)閉
第六個里面的內(nèi)容關(guān)閉
沒有選擇類型
文章主要介紹一種簡潔的選項卡效果的實現(xiàn)，兼容性較好，方便大家直接使用。雖然我是做相關(guān)軟件編程的，但是，我對這些的知識也是非常喜歡，業(yè)余愛好手，也可以稱發(fā)燒友。呵呵！