flowers

Blogger Tricks

Friday, February 13, 2015

Mouse Hover Rounded image Css code


ပံုေလးေတြကို css code ႏွင့္ကစားလိုသူမ်ားအတြက္ ေနာက္ထပ္ကုဒ္ေလး တစ္ခု ထပ္တင္လိုက္ပါတယ္ က်ေနာ္ကိုယ္တိုင္စမ္းျပီးေတာ့ မွ တင္ေပးလိုက္ပါတယ္ခင္ဗ်ာ။
/* Solve problem where border size changes on hover */
.hover-4wadi-reounded img{
border: 0px solid black;
}
.hover-4wadi-reounded img:hover {
border: 0px solid #BADA55;
margin: 0;
padding: 0;
border-radius: 900px;
-moz-border-radius: 900px;
}
  • ဒီကုဒ္လးေတြကေတာ့ အေပၚမွာ ျပထားတဲ့ ပံုေလးလိုေပါ့ Mouse ကိုေရြ႕လိုက္ရင္ ပံုေလးက ဝုိုင္းသြားမွာ ျဖစ္ပါတယ္။ စက္ဝိုင္းပံု အညီျဖစ္ဖို႔ အတြက္ကေတာ့ မိမိ တင္တဲ့ပံုေလးဟာ ေလးေထာင့္ညီ စတုရန္းေလး ျဖစ္ဖို႔ေတာ့ လိုပါမယ္ ဒါမွမဟုတ္ရင္ေတာ့ စက္ဝိုင္းပံု အညီ ထြက္မွာ မဟုတ္ပါဘူးခင္ဗ်ာ။

  • ေအာက္မွာ ကေတာ့ Posting တြင္ အသံုးျပဳ ရန္ ကုဒ္ေတြျဖစ္ပါတယ္ခင္ဗ်ာ။
<center>
 <div class="hover-4wadi-reounded">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSXNU6VKmTXt0dmmpz7qrWmZ2Z0JJsRlnHyORcbv_2MNuMJ4ca_QdumtHPyaIeHdz4_t9p1NSNr5DmF5WGCa_u1fgxcDkH7poizgIrbx6spOj3xzakuUPtWzylNfF284u2qkFY5kpEQRl-/s200/ardae4.png" /></div>
</center>


HOW TO ADD CSScss ကို ဘယ္မွာထည့္ရတယ္ဆိုတာ မသိေသးေသာ သူငယ္ခ်င္းမ်ား ဒီေအာက္က how to add css ဆိုတဲ့ေနရာမွာ click ျပီးၾကည့္ႏိုင္ပါတယ္။

  • အဆင္ေျပၾကလိမ့္မယ္လို႔ ေမွ်ာ္လင့္ပါတယ္ ခင္ဗ်ာ။

No comments:

Post a Comment