<style type="text/css">
div.TabView div.Tabs a
{
float: left;
display: block;
width: 98px; 
height: 22px; 
text-align: center; 
margin: 0px 0px 0px 0px; 
background-color:#04916b;
padding-top: 6px;
border: 1px solid #ffffff; 
border-bottom: 0px solid #034735; 
font-family: "Arial, Helvetica, sans-serif", Arial; 
font-weight: 900;

}
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active
{
background-color: #034735; }
div.TabView div.Pages
{
clear: both;
border: 1px solid #04916b;-moz-border-radius:5px;-webkit-border-radius:5px; 
overflow: hidden;
background-color: #fff; 
}
div.TabView div.Pages div.Page
{
padding: 2px;
height: 100%;
overflow: hidden;
}
div.TabView div.Pages div.Page div.Pad
{
padding: 0px 5px;
}
.list {
background: url("http://lh4.ggpht.com/_15FopxVONSo/ShYuf4RqUuI/AAAAAAAACxI/jcump2GgfLg/iconbullet.gif") no-repeat left center;
border-bottom:1px dotted #7f7f7f;
line-height:1.5em;
padding:3px 0px 3px 20px;
}
</style>

<form action="tabview.html" method="get">
<div id="TabView" class="TabView">
<div style="width: 300px;" class="Tabs">
<a><span style="color: #fff">Tab 1</span></a>
<a><span style="color: #fff">Tab 2</span></a>
<a><span style="color: #fff">Tab 3</span></a>
</div>
<div style="width: 300px;height:350px;" class="Pages">

<div class="Page">
<div class="Pad">
Konten tab 1 ( srcipt/kode anda ) 
</div></div>

<div class="Page">
<div class="Pad">
Konten tab 2 ( script/kode anda )
</div>
</div>

<div class="Page">
<div class="Pad">
KOnten tab 3 (script/kode anda)
</div></div>
</div></div></form>

<script src="https://sifadly.googlecode.com/files/tab-view-sifadly.js">
</script>
<script type="text/javascript">
tabview_initialize('TabView');
</script>