Cara Membuat Label Keren di Blog Dengan Efek CSS3

Sesuai judul nya saya mosting tentang  Cara Membuat Label Keren di Blog Dengan Efek CSS3
ya langsung saja Kita simak bersama2
baca Bismilah dulu ya :D

1 . Log In Blogger
2 . Pilih Blog Yang Akan Di Edit
3 . Pergi Ke Template 
4 . Klik Edit HTML
5 . Centang Expand Template Widget
6 . Cari Tulisan ]]></b:skin> ( Tekan Ctrl + F Atau    F3 Di Keyboard Untuk Mencari )
7 . Pasang Kode Di Bawah Ini Tepat Di Atas Kode ]]></b:skin>

/*--- Iradi-INSIDE Custom Label With CSS3 --- */ .Label a{ padding-left:20px; background:#00FFFF; padding:0 20px; color:#000!important; border-radius:100px; -moz-border-radius:100px; height:17px; line-height:17px; text-transform:uppercase; text-decoration:none; border:none !important; -webkit-transition:all .3s ease-in-out !important;t: 30pxt: 30px; float:left; margin-left:5px; margin-top:5px; font-size:14px; } .Label a:hover{ color:#000 !important; background:#fff; }

10 . Simpan
11 . Sekarang,Pergi Ke Tata Letak 
12 . Cari Label , Terus Klik Edit
13 . Sama-Kan Label Anda Dengan Gambar Di Sebelah Ini
14 . Simpan

NB : Yang Hitam Tebal Di Klik
         Yang Merah Di Cari
         Yang Orange Kotak Label Pertama
         Yang Hijau Text Label Pertama
         Yang Biru Kotak Label Berubah Warna
         Yang Pink Text Label Berubah Warna


Lihat Hasil Nya Menakjubkan Bukan , Nah Sekian Artikel Dari Mimin Thank's Atas Kunjungan Nya 

• Masuk Template >  EDIT HTML
• Cari kode ]]></b:skin>.

 Masukkan kode kode di bawah ini tepat di atas Kode ]]></b:skin> Tadi

 Style 1 

.label-size a{padding-left:10px;background:#0090d5;padding:0 10px;color:#fff!important;height:28px;line-height:26px;text-decoration:none;border:none!important;-webkit-transition:all .3s ease-in-out!important;t:30pxt:30px;float:left;margin-left:3px;margin-top:3px;font-size:14px;font-family:Arial,sans-serif}
.label-size a:hover{background:#555;box-shadow:1px 1px 2px 2px rgba(0,0,0,0.5);-o-transition:all .3s;-moz-transition:all .3s;-webkit-transition:all .3s;-moz-transform:scale(1.1);-o-transform:scale(1.1);-webkit-transform:scale(1.1);transition:all .5s;-moz-transition:all .5s;-webkit-transition:all .5s;-o-transition:all .5s;-webkit-border-radius:1px;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px}

Style 2

.cloud-label-widget-content {text-align:center;font-weight: bold;padding: 4px 0}
.cloud-label-widget-content span {display: inline-table; line-height: 1.2;}
.cloud-label-widget-content span a {padding:3px 4px;color:#fff}
.label-size {margin:3px}
.label-size span {background:#E95D0C;padding:3px 4px;color:#fff}
.label-size-1 a {background:#0090d5;font-size:13px;}
.label-size-2 a {background:#E20000;font-size:13px;}
.label-size-3 a {background:#00CEAC;font-size:13px;}
.label-size-4 a {background:#CEEA00;font-size:13px;}
.label-size-5 a {background:#EA9C00;font-size:13px;}
.cloud-label-widget-content span a:hover {background:#555;}

 Style Ke 3

.label-size a{padding-left:10px;padding:0 10px;color:#fff!important;height:28px;line-height:26px;text-decoration:none;border-radius:3px;-moz-border-radius:3px;-webkit-border-radius:3px;background:#B8B8B8;border:0;border-radius:3px;color:#fff;t:30pxt:30px;float:left;margin-left:3px;margin-top:3px;font-size:14px;font-family:Arial,sans-serif;}
.label-size a:hover{background:#9B9B9B;font-weight: bold; font-variant: small-caps;}
.label-size span{float:right;font-size:9px;margin:0 0 4px;}

Lalu simpan template..
sekian semoga ini bisa membantu anda sekalian untuk membuat mofidikasi Label..