Customize Labels With CSS3 Effects on Blogger/Blogspot

I Already Made a Post About How to Create a Label and How to Customize it with Colors Just Read that If You don't know How to create a Label.

PLEASE NOTE IF YOU ALREADY HAVE  LABEL WIDGET PLACED ON YOUR BLOG THEN GO TO LAYOUT-->EDIT( Where you placed your Label) And Make Sure you have Checked Cloud on Display Option

Now I Will Show you to add CSS3 Effects on Labels

• Go to the Blogger Dashboard and Click on Template then Edit HTML
• Now Search for the following code

]]></b:skin>

•  Then Place the Below Code Just Above it.

.Label a{  background: rgb(0,100,180);

background: -moz-linear-gradient(top,  rgba(0,100,180,1) 0%, rgba(20,60,100,1) 100%);

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,100,180,1)), color-stop(100%,rgba(20,60,100,1)));

background: -webkit-linear-gradient(top,  rgba(0,100,180,1) 0%,rgba(20,60,100,1) 100%);

background: -o-linear-gradient(top,  rgba(0,100,180,1) 0%,rgba(20,60,100,1) 100%);

background: -ms-linear-gradient(top,  rgba(0,100,180,1) 0%,rgba(20,60,100,1) 100%);

background: linear-gradient(top,  rgba(0,100,180,1) 0%,rgba(20,60,100,1) 100%);

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0064b4', endColorstr='#123d60',GradientType=0 );

display:inline-block;border: 1px solid #005ca6;padding:0 8px; color:#fff!important; height:28px; line-height:28px; text-transform:capitalize; text-decoration:none;float:left;margin-top:5px; font-size:14px;-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out;text-shadow: 0 -1px -1px rgba(0, 0, 0, 0.2);

}

.Label a:hover{color:#000 !important; background:#123d60;}

• That's All you are done now Just Open your blog and See..