Kumpulan Kode CSS Untuk Merapihkan Label Blog

↑ Grab this Headline Animator

Kumpulan Kode CSS Untuk Merapihkan Label Blog Biar Keren

Hay sobat blogger pada kesempatan kali  ini saya akan share Kode CSS Untuk Merapihkan Label di blogspot . hampir semua blog memberikan widget Label . Gunanya ya untuk mempermudah melihat Artikel sesuai kategori, dengan widget label / kategori pasti akan mempermudah dalam memilih Artikel yang berkaitan dengan artikel lainya . Nah untuk mempercantik tampilan label agar pengunjung lebih senang tentunya .  kalian tinggal pake saja  kode CSS yang sudah saya kumpulkan nih . Tinggal kalian ganti saja kodenya di Template-Edit HTML Ctrl-F-search dengan kata label-size . kalau sudah gantikan kodenya dngn kode kode berikut ini , pilih salah satu yang kamu suka . Ok

Berikut adalah Kumpulan Kode CSS Untuk Merapihkan Label Blog :

Kode CSS Label 1

/*--- TricksHunt.com Custom Label Cloud --- */
.Label a{
padding-left:10px;
background:#0090D5;
padding:0 10px;
color:#fff!important;
height:26px;
line-height:26px;
text-decoration:none;
border:none !important;
-webkit-transition:all .3s ease-in-out !important;t: 30pxt: 30px;
float:left;
margin-left:1px;
margin-top:1px;
font-size:13px; }
.Label a:hover{
background:#69625A;
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: px;
}

Kode CSS Label 2

/* ETIQUETAS PERSONALIZADAS CON CSS */
.Label a{
padding-left:10px;
background:#0090D5; /* Color de fondo */
padding:0 10px;
color:#fff!important; /* Color de la fuente */
height:26px;
line-height:26px;
text-decoration:none;
border:none !important;
-webkit-transition:all .3s ease-in-out !important;t: 30pxt: 30px; /* transicion */
float:left;
margin-left:3px;
margin-top:3px;
font-size:13px; /* tamaño de la fuente */
-webkit-border-radius: 4px; /* Bordes redondeados */
-moz-border-radius: 4px; /* Bordes redondeados */
border-radius: 4px; /* Bordes redondeados */
}

.Label a:hover{
background:#69625A; /* Color de fondo al pasar el mouse */
-webkit-border-radius: 8px; /* Bordes redondeados al pasar el mause */
-moz-border-radius: 8px; /* Bordes redondeados al pasar el mause */
border-radius: 8px; /* Bordes redondeados al pasar el mause */
}
/* FIN ETIQUETAS PERSONALIZADAS CON CSS */

Kode CSS Label 3

.label-size{
 margin:0;
 padding:0;
 position:relative;
 }
 .label-size a{
 float:left;
 height:24px;
 line-height:24px;
 position:relative;
 font-size:12px;
 margin-bottom: 9px;
 margin-left:20px;
 padding:0 10px 0 12px;
 background:#0089e0;
 color:#fff;
 text-decoration:none;
 -moz-border-radius-bottomright:4px;
 -webkit-border-bottom-right-radius:4px;
 border-bottom-right-radius:4px;
 -moz-border-radius-topright:4px;
 -webkit-border-top-right-radius:4px;
 border-top-right-radius:4px;
 }
.label-size a:before{
 content:"";
 float:left;
 position:absolute;
 top:0;
 left:-12px;
 width:0;
 height:0;
 border-color:transparent #0089e0 transparent transparent;
 border-style:solid;
 border-width:12px 12px 12px 0;
 }
.label-size a:after{
 content:"";
 position:absolute;
 top:10px;
 left:0;
 float:left;
 width:4px;
 height:4px;
 -moz-border-radius:2px;
 -webkit-border-radius:2px;
 border-radius:2px;
 background:#fff;
 -moz-box-shadow:-1px -1px 2px #004977;
 -webkit-box-shadow:-1px -1px 2px #004977;
 box-shadow:-1px -1px 2px #004977;
 }
.label-size a:hover{background:#555;}
.label-size a:hover:before{border-color:transparent #555 transparent transparent;}

Sekian postingan Kumpulan Kode CSS Untuk Merapihkan Label Blog Biar Keren , pilih saja yang sesuai dengan skin blog kalian yah :D , jika ada yang di tanyakan atau merasa kesulitan boleh nanya di sisni . Thanks .

Dunia Aneh
Kumpulan Artikel Unik dan Aneh sepanjang Masa
Catatan dosen

Tips Android dan BBM
Kumpulan Ulasan tentang Tips Android dan BBM
Putera Dosen

Meme Lucu Banget
Kumpulan Meme Lucu yang lagi ngetren
Cds Blog

Kumpulan Artikel Menarik
Semua Artikel yang Kamu Cari Ada di sini
230 Penulis
Ads by BLOGGER

Posted by Very Handika

Tweet