Membuat TAB dengan bootstrap

31 October 2016 202

tab-dalam-bootstrap

Membuat tampilan jadi lebih menarik dengan TAB, langkah ini amat terbilang cukup mudah. Dalam bootstrap TAB sudah dipersiapakan, hanya tinggal menambah code saja TAB sudah terbentuk.

Contoh TAB dengan Bootstrap :

<ul class=”nav nav-pills nav-justified”>

<li class=”active”><a data-toggle=”tab” href=”#tab-1″>TAB Pertama</a></li>

<li><a data-toggle=”tab” href=”#tab-2″>TAB Kedua</a></li>

<li><a data-toggle=”tab” href=”#tab-3″>TAB Ketiga</a></li>

</ul>

<div class=”tab-content”>

<div id=”tab-1″ class=”tab-pane fade in active”>

Content Tab Pertama

</div>

<div id=”tab-2″ class=”tab-pane fade in”>

Content Tab Kedua

</div>

<div id=”tab-3″ class=”tab-pane fade in”>

Content Tab Ketiga

</div>

</div>

Code dalam <ul class=”nav nav-pills nav-justified”> adalah untuk navigasi menu dalam TAB, sedangkan <div class=”tab-content”> adalah untuk Content dari tab tersebut dengan memberikan <div id=”tab-1″ class=”tab-pane fade in active”> id=”tab-1″ untuk menghasilkan tampilan pada Tab Pertama, begitupun selanjutnya.

Kata kunci untuk Artikel ini :

Artikel Terkait

Cara mudah membuat theme wordpress responsif dengan bootstrap part 5

Membuat tampilan jadi lebih menarik dengan TAB, langkah ini amat terbilang cukup mudah. Dalam bootstrap TAB sudah dipersiapakan, hanya tinggal menambah code saja TAB sudah terbentuk. Contoh TAB

Cara mudah membuat theme wordpress responsif dengan bootstrap part 4

Membuat tampilan jadi lebih menarik dengan TAB, langkah ini amat terbilang cukup mudah. Dalam bootstrap TAB sudah dipersiapakan, hanya tinggal menambah code saja TAB sudah terbentuk. Contoh TAB

Cara mudah membuat theme wordpress responsif dengan bootstrap part 3

Membuat tampilan jadi lebih menarik dengan TAB, langkah ini amat terbilang cukup mudah. Dalam bootstrap TAB sudah dipersiapakan, hanya tinggal menambah code saja TAB sudah terbentuk. Contoh TAB

Membuat menu responsif kombinasi wordpress bootstrap nav walker

Membuat tampilan jadi lebih menarik dengan TAB, langkah ini amat terbilang cukup mudah. Dalam bootstrap TAB sudah dipersiapakan, hanya tinggal menambah code saja TAB sudah terbentuk. Contoh TAB
Bootstrap
Belum ada komentar. Anda bisa menjadi yang pertama untuk berkomentar!

Tinggalkan komentar

*
*
-

error: Content is protected !!