Membuat Widgate Label Keren Dengan Css

Pada toturial kali ini mengenai Membuat Widgate Label Keren Dengan css mungkin sudah bosan dengan tampilan label blog sobat yang biasa-biasa aja dan ingi merubanya.. 

Nah, pada ini aku akan menunjukkan caranya ke teman-taman semua Membuat Widgate Label Keren Dengan css. dengan sedikit menambah script css pada HTML blog sobat..!!!

Jika sobat igin menerapkan di blog sobat silahkan ikuti langkah-langkah di bawah ini:


1. Login ke Account Blogger sobat
2. Pilih Tata letak kemudian Tambah Gadget 

3. Kemudian Pilih "Label"

4. Lalu edit Labelnya menjadi ibarat gambar dibawah ini

5. Kemudian Save

6.  Setelah itu sobat masuk ke Template
7. Klik Edit HTML

8. Cari arahan ]]></b:skin>
9. Lalu copy arahan dibawah ini sempurna diatas arahan ]]></b:skin>

/* Code By www.semukan.blogspot.com*/ .list-label-widget-content ul { list-style-type:none; padding-left:0px !important; display:inline-block !important; } .list-label-widget-content li { display:inline-block; } .list-label-widget-content li a { color: #777; font: 9px verdana; text-transform: uppercase; transition: border-color .218s; background: #f4f4f4; background: -webkit-gradient(linear, 0% 40%, 0% 70%, from( #F5F5F5), to( #F1F1F1)); display: inline-block; text-shadow: 0 1px 0 #fff; -webkit-transition: border-color .218s; -moz-transition: border .218s; -o-transition: border-color .218s; transition: border-color .218s; background: #f3f3f3; background: -webkit-gradient(linear, 0% 40%, 0% 70%, from( #F5F5F5), to( #F1F1F1)); background: -moz-linear-gradient(linear, 0% 40%, 0% 70%, from( #F5F5F5), to( #F1F1F1)); border: solid 1px #ccc; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; margin: 0 4px 4px 0; padding: 3px 5px; text-decoration: none; } .list-label-widget-content li a:hover { color: #333; border-color: #999; -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2) -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2); box-shadow: 0 1px 2px rgba(0,0,0,0.15); }

10. simpan dan lihat hasilnya.

Itu saja mengenai cara Membuat Widgate Label Keren Dengan css supaya bermamfaat.!!!

Sumber http://semukan.blogspot.com

Share this post

Berlangganan update artikel terbaru via email: