<style>
.po_title{ float:left;}
.life{ padding:10;}
</style>




<script language>
function premier(n) {
for(var i = 1; i < 4; i++) {
obj = document.getElementById('premier'+i);
img = document.getElementById('premier_button'+i);
if ( n == i ) {
obj.style.display = "block";
img.height = 32;
img.src = "./images/tab/tabon"+i+".gif";
} else {
obj.style.display = "none";
img.height = 32;
img.src = "./images/tab/taboff"+i+".gif";
}
}
}
</script>

<div style=" width:326px; height:179px;">
<div style="width:326px; height:32px;overflow:hidden;">
<span class="po_title">
<img src="./images/tab/tab_left.gif" width="123" height="32" />
</span>
<span class="po_title">
<img src="./images/tab/tabon.gif" width=64 height=32 OnClick='premier(1);' OnMouseOver='this.style.cursor="hand";premier(1);' OnMouseOut='this.style.cursor="default"' id='premier_button1'></a>
</span>
<span class="po_title">
<img src="./images/tab/taboff1.gif" width=64 height=32 OnClick='premier(2);' OnMouseOver='this.style.cursor="hand";premier(2);' OnMouseOut='this.style.cursor="default"' id='premier_button2'></a>
</span>
<span class="po_title">
<img src="./images/tab/taboff2.gif" width=64 height=32 OnClick='premier(3);' OnMouseOver='this.style.cursor="hand";premier(3);' OnMouseOut='this.style.cursor="default"' id='premier_button3'></a>
</span>
<span class="po_title">
<img src="./images/tab/tab_right.gif" width="11" height="32" />
</span>
</div>

<div style="width:326px; height:179px; overflow:hidden;background:url(./images/tab/tabbg.gif);">
<span id='premier1' class="life" style='display:none;'><?=latest("best_site", best_01, 1, 37);?></span>

<span id='premier2' class="life" style='display:none;'><?=latest("best_site", best_02, 1, 37);?></span>

<span id='premier3' class="life" style='display:none;'><?=latest("best_site", best_03, 1, 37);?></span>


</div>
</div>

<script>
premier(1);
//괄호안에 숫자를 탭순서로 넣으면 그 탭이 활성화돼 열립니다
</script>