Tab Horisontal Accordion Dengan CSS3 di Blog – Dengan menggunakan kode CSS tab horisontal accordion yang sederhana ini siap dipasang di blog Sobat. Dengan menampilkan warna silver sebagai warna utama dan warna hitam sebagai warna hover. Saat hover pula akan menampilkan panel yang muncul secara otomatis tanpa harus di klik dan konten akan terlihat secara halus nampak dari sebelah kiri akan menjadi melebar kesebelah kanan. Berikut adalah tutorial untuk cara Tab Horisontal Accordion Dengan CSS3
1. Login ke akun blogger.
2. Copy kode dibawah ini, kemudian klik
Template > Sesuaikan > Tingkat Lanjut > Tambahkan CSS (paste kode di kolom CSS tersebut).
3. Klik Terapkan ke Blog.
Selanjutnya bila akan menampilkan Tab Horisontal Accordion Dengan CSS3 ini kedalam postingan maka langkahnya menggunakan mode HTML kemudian masukan kode dibawah ini:
<div class="horizontalaccordion">
<ul>
<li>
<h3>Anak Bengkel 1</h3>
<div>Kolom isi Anak Bengkel untuk Panel 1</div>
</li>
<li>
<h3>Anak Bengkel 2</h3>
<div>Kolom isi Anak Bengkel untuk Panel 4</div>
</li>
<li>
<h3>Anak Bengkel 3</h3>
<div>Kolom isi Anak Bengkel untuk Panel 4</div>
</li>
<li>
<h3>Anak Bengkel 4</h3>
<div>Kolom isi Anak Bengkel untuk Panel 4</div>
</li>
</ul>
</div>
Keterangan:
- Silahkan ubah tulisan yang berwarna KUNING dengan judul
- Silahkan ubah tulisan yang berwarna HIJAU dengan konten sesuai keinginan Sobat.
- Apabila ingin ditampilkan sebagai widget maka langkahnya seperti biasa, klik Tata Letak > Tambah Widget > HTML/JavaScript kemudian paste kode yang ada diatas tersebut pada kolom yang tersedia.
Selengkapnya
→
Tab Horisontal Accordion Dengan CSS3