Kumpulan Kode CSS Untuk Merapihkan Label Blog

ILMUANE new update

↑ 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

20 Responses to " Kumpulan Kode CSS Untuk Merapihkan Label Blog "

  1. Seru nih kalau main CSS :)
    Kita sharing yuk tentang CSS..

    ReplyDelete
    Replies
    1. yukk shareing , lagi nyari nyari lagi nih bro , buat di pajangin di blog :D

      Delete
  2. wew,, tampilannya jadi bagus ..
    terima kasih tutorialnya gan :D

    ReplyDelete
  3. wah bagus kayaknya tuh ijin pasang di blog gan :D

    ReplyDelete
  4. keren kang style yang terakhir :D boleh di terapkan tuh ke blog ane :D

    ReplyDelete
  5. yang nmor 3 keren tuh,
    ijin nyoba ya gan :D

    ReplyDelete
    Replies
    1. kalau saya sih bagusan yang pertama :D , lebih rapihh

      Delete
  6. pada bagus gan CSSnya :D
    izin bookmark dulu :)

    ReplyDelete
    Replies
    1. hhaha silahkan gan , pake 1 persat , :D

      Delete
  7. ijin nyoba gan. thanks infonya

    ReplyDelete
  8. ijin nyoba dlu ni kang , makasi gan :D

    ReplyDelete
  9. wow.. ane suka nih tutorial :D Soalnya simple
    thanks gan

    ReplyDelete
  10. wah , jadinya rapi dan bagus ya gan...
    ijin coba gan

    ReplyDelete
  11. widget labelnya keren keren , langsung ane coba

    ReplyDelete
  12. keren juga nih labelnya, btw klo mau ganti warnanya gimana ?

    ReplyDelete
    Replies
    1. ganti aja kode warna , yang background:#0090D5

      Delete
  13. keren bro kunjungi blog ane sob butuh bantuan ane sob v http://sekhalikedungsoegih.blogspot.com/

    ReplyDelete

SILAHKAN BERKOMENTAR YANG SOPAN... Jangan meninggalkan link aktif , komentar spam tidak akan dipublikasikan!