Untuk Contoh penggunaan tabs dalam postingan bisa dilihat pada postingan sebelumnya disini
Penerapan syntaxnya sebagai berikut :
<!--[ Active function ]-->
<input class='tbIn hidden' id='fTabs-1' type='radio' name='postTabs' checked>
<input class='tbIn hidden' id='fTabs-2' type='radio' name='postTabs'>
<input class='tbIn hidden' id='fTabs-3' type='radio' name='postTabs'>
<!--[ Tabs header/title ]-->
<div class='tbHd scrlH'>
<!--[ Change atribute data-text='...' to replace tabs title ]-->
<label for='fTabs-1' data-text='Chapter 1'></label>
<label for='fTabs-2' data-text='Chapter 2'></label>
<label for='fTabs-3' data-text='Chapter 3'></label>
</div>
<div class='tbCn'>
<!--[ Tabs content ]-->
<div class='tbText-1'>
Sungai Brantas adalah sungai utama di provinsi Jawa Timur, Indonesia, dan merupakan sungai terpanjang kedua di pulau Jawa setelah Sungai Bengawan Solo. Sungai ini memiliki peran yang sangat penting dalam kehidupan masyarakat dan ekosistem sekitarnya.
</div>
<!--[ Tabs content ]-->
<div class='tbText-2'>
Sungai Brantas memiliki sejarah panjang yang berkaitan dengan kerajaan-kerajaan kuno di Jawa Timur, seperti Kerajaan Mataram Kuno, Kediri, Singasari, dan Majapahit. Sungai ini digunakan sebagai jalur transportasi dan perdagangan. Sungai Brantas merupakan sumber utama irigasi bagi pertanian di Jawa Timur. Sistem irigasi yang baik sangat penting untuk mendukung produksi padi dan tanaman lainnya di daerah ini.
</div>
<!--[ Tabs content ]-->
<div class='tbText-3'>
Sungai Brantas adalah sungai yang sangat penting di Jawa Timur, baik dari segi ekonomi, ekologi, maupun budaya. Namun, sungai ini juga menghadapi tantangan besar seperti polusi dan pengelolaan sumber daya air yang berkelanjutan. Upaya kolaboratif dari berbagai pihak diperlukan untuk menjaga dan memanfaatkan Sungai Brantas secara optimal.
</div>
</div>
Untuk Chapter 1, Chapter 2, Chapter 3 silahkan digan dengan judul tabs dan isi dari tab (cetak tebal) ganti dengan konten yang kalian miliki.