widget label berbentuk daun

Label  adalah merupakan salah satu cara untuk memberikan kategori pada setiap postingan kita. Pemberian label pada setiap artikel kita, akan sangat bermanfaat untuk memudahkan pengunjung dalam memilih kandungan dengan kategori yang sesuai dengan yang mereka cari dan  membolehkan  pengunjung dengan mudah mengakses kandungan  yang mereka perlukankan.

Posting kali ini adalah unuk memberi kelainan pada paparan widget label.paparannya adalah berbentuk bujur sperti daun.bagi yang inginmembuanya berikut adalah langkahnya

Cara membuatnya.
1.Masuk ke dashboard blogger
2. Pilih template -> Edit HTML Cari ]]></b:skin> dan salin kod label seperti dibawah dan
    letakkan diatas kod ]]></b:skin>
3.Simpan template anda

.Label a {
     -moz-border-bottom-colors: none;
     -moz-border-left-colors: none;
     -moz-border-right-colors: none;
     -moz-border-top-colors: none;
     background-color: #7FBF4D;
     background-image: -moz-linear-gradient(center top , #7FBF4D, #63A62F);
     border-bottom-right-radius: 30px;
     border-color: #63A62F #63A62F #5B992B;
     border-image: none;
     border-style: solid;
     border-top-left-radius: 30px;
     border-width: 1px;
     box-shadow: 0px 1px 0px 0px #96CA6D inset;
     color: #FFFFFF;
     float: left;
     font: 14px verdana;
     height: 18px;
     margin-bottom: 9px;
     margin-left: 10px;
     padding: 10px;
     position: relative;
     text-decoration: none;
     transition: all 0.5s ease-in-out 0s;
}

.Label a:hover {
     background: none repeat scroll 0% 0% orange;
     border-radius: 0px 30px 0px 30px;
     border: 1px solid orange;
     text-shadow: 5px 5px 5px #DCDCDC;
}

.Label {
     margin: 0px;
     padding: 0px;
     position: relative;
}
.Label li:hover {
    transform: rotate(5deg);
}
.Label li {
    float: left;
    font-size: 116%;
    list-style: none outside none;
    transition: all 0.3s ease 0s;
}