Cara Modifikasi Label Blog Dengan Css

Kali ini saya akan berbagi kepada kalian sebuah tutorial blogger. Mungkin bukan hal bukan hal baru lagi. Namun, tidak masalah. Saya akan berbagi kepada yang membutuhkan saja. Tutorial apa itu? Ya, tutorial tentang bagaimana caranya memodifikasi tampilan label blog dengan css. Kalian sudah tahukan apa yang di maksud dengan label? Saya anggap sudah pada tahu. Kalian bisa melihat contohnya seperti di bawah ini :

Bagaimana? Itu adalah tampilan label saya setelah saya modifikasi. Bagaimana? Tertarik? Oke, langsung saja. Berikut ini adalah caranya :

• Pertama, tentu saja kalian harus sudah memasang widget label.
• Jika belum, kalian pasang terlebih dahulu. Namun pilih yang label list.
• Jika sudah, sekarang masuk ke dasboard blog kalian.
• Masuk ke menu Template.
• Pilih yang Edit HTML.
• Cari kode ]]></b:skin>.
• Masukkan kode di bawah ini tepat di atas kode ]]></b:skin>.

/* LABEL */

.Label ul {

padding:5px;

overflow:hidden;

}

.Label li {

float:left;

margin-right:2px;

margin-bottom:2px;

padding:4px 8px;

color:#FFFFFF;

background-color:#2980b9; list-style:none; -moz-transition:all 0.5s; -webkit-transition:all 0.5s;

}

.Label li:hover {

color:#FFFFFF;

background-color:#0e0e0e;

}

.Label li a {

color:#FFFFFF;

}

• Terakhir tinggal disimpan. 

Keterangan :

Kode yang berwarna ORANGE adalah kode warna teks label. Kalian bisa mengaturnya sesuai keinginan.

Kode yang berwarna KUNING adalah kode warna background label. Kalian bisa mengaturnya sesuai keinginan.

Kode yang berwarna HIJAU adalah kode lamanya proses transisi animasi. Kalian bisa mengaturnya sesuai keinginan.

Kode yang bercetak TEBAL adalah kode style label saat di arahi mouse. Style labe akan berubah. Seperti background atau warna teksnya. Kalian bisa mengaturnya sesuai keinginan.

Bagaimana? Jadikan? Sekian artikel saya kali ini. Semoga bermanfaat bagi kita semua. Jangan lupa tinggalkan komentar dan klik like tombol like di bawah ini.

Share :

Facebook Google+ Twitter