MEMBUAT TAB VIEW 0

tab view seperti di atas dapat di pasang di blog anda sendiri... berikut cara - caranya :

1. copy code di bawah ini :

   <style type="text/css"><br />div.TabTampil div.TTs<br />{height: 24px; overflow: hidden; }<br />div.TabTampil div.TTs a:hover, div.TabTampil div.TTs a.Active<br />{ background-color: #77d0ee; }<br />div.TabTampil div.Halamans<br />{ clear: both; border: 1px solid #0199cb; overflow: hidden; background-color: #ffffff;}<br />div.TabTampil div.Halamans div.Halaman<br />{ height: 100%; padding: 0px; overflow: hidden; }<br />div.TabTampil div.Halamans div.Halaman div.Alas<br />{ padding: 3px 5px; }<br />div.TabTampil div.TTs a<br />{ border-left:1px solid #0199cb; border-right:1px solid #0199cb; border-top:1px solid #0199cb; border-bottom:0px solid #0199cb; float: left;<br />display: block; width: 100px; text-align: center; height: 24px; padding-top: 3px; vertical-align: middle; text-decoration: none; font-family: "Arial", Serif;<br />font-size: 12px; font-weight: 900; color: #222}<br /></style>
   
   
   <form action="tabtampil.html" method="get">
   <div id="TabTampil" class="TabTampil">
   <div style="width: 370px;" class="TTs"> <a>nama tab 1</a> <a>nama tab 2</a> <a>nama tab 3</a></div>
   <div style="width: 350px; height: 300px;" class="Halamans">
   <div class="Halaman">
   <div class="Alas">
   ISI TAB 1
   ISI TAB 1
   ISI TAB 1
   </div>
   </div>
   
   
   <div class="Halaman">
   <div class="Alas">
   ISI TAB 2
   ISI TAB 2
   ISI TAB 2
   </div>
   </div>
   
   
   <div class="Halaman">
   <div class="Alas">
   ISI TAB 3
   ISI TAB 3
   ISI TAB 3
   </div>
   
   
   </div>
   </div>
   
   </div></form>

2. buat sebuah elemen html/javascript bari
3. paste code yang sudah di copy tadi
4. simpan

selesai.....

keterangan :

kode merah => boleh di ganti
kode biru => harus diganti

Baca Juga Artikel Terkait