Convert Your Blogger Label Tags with CSS3 Style

 သူငယ္ခ်င္းတို႔ရဲ႕ Blog Lables ေတြကိုအခုလို CSS3 Style ေလးနဲ႔ထားခ်င္တယ္ဆိုရင္
ေအာက္မွာဘယ္လိုလုပ္ရလဲဆိုတာအေသးစိတ္ရွင္းျပထားပါတယ္။
ပထမဆံုး မိမိတို႔ရဲ႕ ဘေလာ့စ္ကေန Template ကိုသြားလိုက္ပါ။
ျပီးရင္ Edit Html ထဲကိုႏွိပ္ျပီး၀င္လိုက္ပါ။ အေရးၾကီးတာက မိမိ Template ကိုအရင္
BackUp လုပ္ထားပါ။ျပီးရင္.. Ctrl+f ႏွိပ္ျပီးရွာ။ မ်က္စိအားေကာင္းရင္ေတာ့ ဒီတိုင္းရွာပါ။
 ]]></b:skin>  ဆိုတာေတြ႔ရင္ သူ႔အေပၚမွာ ေအာက္ကကုတ္ကိုကူးျပီး ထည့္ေပးလိုက္ပါ။
တစ္ခ်ိဳ႕ Templates ေတြမွာ ဒီလိုျဖစ္ေနတတ္ပါတယ္ </b:skin>...</b:skin>  ဒီလိုျဖစ္ေနရင္ အဲ့ဒီ့ 2ခုၾကားမွာ
ကလစ္တစ္ခ်က္ႏွိပ္လိုက္ပါ။ ဖြက္ထားတဲ့ DATA ေတြေပၚလာပါလိမ့္မယ္။

ခုနကရွာမေတြ႔တဲ့   ]]>< /b:skin> ကုဒ္ေလးေပၚလာပါျပီ။ အဲ့ဒီ့ကုဒ္ေလးရဲ႕အေပၚမွာေအာက္ကကုဒ္
ကိုကူးျပီး Paste လုပ္လိုက္ပါ။

label-size {     float: left;     margin: 0 0 7px 20px;     position: relative;     font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;     font-size: 0.75em;     font-weight: bold;     text-decoration: none;     color: #996633;     text-shadow: 0px 1px 0px rgba(255,255,255,.4);     padding: 0.417em 0.417em 0.417em 0.917em;     border-top: 1px solid #d99d38;     border-right: 1px solid #d99d38;     border-bottom: 1px solid #d99d38;     -webkit-border-radius: 0 0.25em 0.25em 0;     -moz-border-radius: 0 0.25em 0.25em 0;     border-radius: 0 0.25em 0.25em 0;     background-image: -webkit-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));     background-image: -moz-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));     background-image: -o-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));     background-image: -ms-linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));     background-image: linear-gradient(top, rgb(254, 218, 113), rgb(254, 186, 71));     filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#feda71', EndColorStr='#feba47');     -webkit-box-shadow: inset 0 1px 0 #faeaba,         0 1px 1px rgba(0,0,0,.1);     -moz-box-shadow: inset 0 1px 0 #faeaba,         0 1px 1px rgba(0,0,0,.1);     box-shadow: inset 0 1px 0 #faeaba,         0 1px 1px rgba(0,0,0,.1);     z-index: 1; } .label-size:before {     content: '';     width: 1.30em;     height: 1.39em;     background-image: -webkit-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));     background-image: -moz-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));     background-image: -o-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));     background-image: -ms-linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));     background-image: linear-gradient(left top, rgb(254, 218, 113), rgb(254, 186, 71));     filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#feda71', EndColorStr='#feba47');     position: absolute;     left: -0.69em;     top: .2em;     -webkit-transform: rotate(45deg);     -moz-transform: rotate(45deg);     -o-transform: rotate(45deg);     transform: rotate(45deg);     border-left: 1px solid #d99d38;     border-bottom: 1px solid #d99d38;     -webkit-border-radius: 0 0 0 0.25em;     -moz-border-radius: 0 0 0 0.25em;     border-radius: 0 0 0 0.25em;     z-index: 1; } .label-size:after {     content: '';     width: 0.5em;     height: 0.5em;     background: #fff;     -webkit-border-radius: 4.167em;     -moz-border-radius: 4.167em;     border-radius: 4.167em;     border: 1px solid #d99d38;     -webkit-box-shadow: 0 1px 0 #faeaba;     -moz-box-shadow: 0 1px 0 #faeaba;     box-shadow: 0 1px 0 #faeaba;     position: absolute;     top: 0.667em;     left: -0.083em;     z-index: 9999; } #Label1 {     height: 210px; } .label-size:hover {     background-image: -webkit-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));     background-image: -moz-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));     background-image: -o-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));     background-image: -ms-linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));     background-image: linear-gradient(top, rgb(254, 225, 141), rgb(254, 200, 108));     filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#fee18d', EndColorStr='#fec86c');     border-color: #e1b160; } .label-size:hover:before {     background-image: -webkit-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));     background-image: -moz-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));     background-image: -o-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));     background-image: -ms-linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));     background-image: linear-gradient(left top, rgb(254, 225, 141), rgb(254, 200, 108));     filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#fee18d', EndColorStr='#fec86c');     border-color: #e1b160; }

။ျပီးရင္ေတာ့ Save Template ေပါ့ေနာ္။
  ရန္ကုန္သား(နည္းပညာျမိဳ႕ေတာ္) http://mm-knowledge.blogspot.com

♪♪ေၾကာ္ျငာေလးေတြ ကလစ္ခဲ႕ျခင္းျဖင့္ ကူညီနုိ္င္ပါသည္အားေပးမႈကုိ ေက်းဇူးတင္ပါသည္ ေနာင္ရုိး♪♪