ဘလော့မှာ မည်သည့်ဆော့ဝဲလ်မှ မသုံးဘဲ 3 D Text စာလုံးတွေရေးနည်း

မင်္ဂလာပါ  သည်နေ့ ရေးဖြစ်တာလေးကတော့ မိမိတို့ဘလော့မှာ  မည့်သည့်ဆော့ဝဲလ်တွေမှ  အသုံးမပြု ဘဲနဲ့  3D  Text  စာလုံးလေး ရေးနည်းကိုဘဲ ဖြစ်ပါတယ်... ဒါလေးကတော့  Css3 ကုဒ်နဲ့ အသုံးပြု ရေးသားထားခြင်းဖြစ်တာကြောင့်  အသင့်ပေးထားတဲ့ ကုဒ်တွေကိုဘဲ အသုံးပြု  ရေးသားလိုက်ပါနော်..  နှစ်သက်တယ်ဆို အောက်မှာ ထည့်နည်းနဲ့ လိုအပ်တဲ့  ကုဒ်တွေကို ပေးထားပါတယ်တော်....လေ့လာလိုက်ပါနော်

အသုံးပြု နည်း
=======

   ►1.  Login လုပ်လိုက်ပါ ဘလော့ကာကို
   ►2.  Layout ကိုကလစ်ရပါ့မယ် မိမိတို့  Dashboard ကနေပေါ့
   ►3.  Add a Gadget ကိုကလစ်ပေးလိုက်ပါ
   ►4.  HTML/Javascript. ကိုကလစ်ပြီး ကျလာတဲ့ ဘောက်လေးထဲမှာဘဲ
   ►5.  အောက်ကပေးထားတဲ့ ကုဒ်တွေကို ကော်ပီယူ ထည့်လိုက်ပါ

              <style>#animationWrapper { width:200px; font-family:"proxima-nova-1","proxima-nova-2","Helvetica Neue","Arial",sans-serif; background:#222; padding:40px; } /* link which encapsulates SPANs */ #animationWrapper a { font-weight: 500; text-transform: uppercase; font-size: 32px; line-height: 0.9em; margin-bottom: 10px; display: block; position: relative; color: #E58; text-decoration: none } /* span and a - "workers" */ #animationWrapper a, #animationWrapper span { -webkit-transition: all 0.12s ease-out; -moz-transition: all 0.12s ease-out; -o-transition: all 0.12s ease-out; -ms-transition: all 0.12s ease-out; transition: all 0.12s ease-out; } #animationWrapper span { display: block; color: #555; text-shadow: 1px 1px black, 2px 2px black, 3px 3px black, 4px 4px black, 5px 5px black, 6px 6px black, 7px 7px black, 8px 8px black; } /* special size for the first item */ #animationWrapper .span1 { font-size: 36px; line-height: 0.8em; } #animationWrapper a:hover { color: #fff ; top: -3px; left: -3px; } /* all spans become white */ #animationWrapper a:hover span { color:#fff; } /* different colors for each SPAN */ #animationWrapper a:hover .span1 { text-shadow: 1px 1px #58E, 2px 2px #58E, 3px 3px #58E, 4px 4px #58E, 5px 5px #58E, 6px 6px #58E, 7px 7px #58E, 8px 8px #58E, 9px 9px #58E, 10px 10px #58E, 11px 11px #58E; } #animationWrapper a:hover .span2 { text-shadow: 1px 1px #F90, 2px 2px #F90, 3px 3px #F90, 4px 4px #F90, 5px 5px #F90, 6px 6px #F90, 7px 7px #F90, 8px 8px #F90, 9px 9px #F90, 10px 10px #F90, 11px 11px #F90; } #animationWrapper a:hover .span3 { text-shadow: 1px 1px #3C7, 2px 2px #3C7, 3px 3px #3C7, 4px 4px #3C7, 5px 5px #3C7, 6px 6px #3C7, 7px 7px #3C7, 8px 8px #3C7, 9px 9px #3C7, 10px 10px #3C7, 11px 11px #3C7; } #animationWrapper a:hover .span4 { text-shadow: 1px 1px #E58, 2px 2px #E58, 3px 3px #E58, 4px 4px #E58, 5px 5px #E58, 6px 6px #E58, 7px 7px #E58, 8px 8px #E58, 9px 9px #E58, 10px 10px #E58, 11px 11px #E58; } </style><center><div id="animationWrapper"> <a href="http://www.aungsanmks.com"> <span class="span1">Welcome</span> <span class="span2">From</span> <span class="span3">My</span> <span class="span4">Blogs</span> </a></div></center>

မှတ်ချက်  ။     ။  ကုဒ်တွေထဲမှာ   http://www.aungsanmks.com  နေရာ မိမိတို့ 

ဘလော့အမည်အစားထိုးနိုင်ပါတယ်... အောက်ဆုံး ကုဒ်တွေထဲက

WELCOME

FROM

MY

BLOGS

ဆိုတာတွေမှာ နှစ်သက်ရာ စာသားကို ရေးနိုင်ပါတယ်... မြန်မာ စာနဲ့လည်း အသုံးပြုနိုင်ပါတယ်။

 ကုဒ်တွေမှာ  FONT  အရွယ်အစားတွေ  အကျယ်အဝန်း စတာတွေ  နံပါတ်တွေပါ  ပါတယ်.. ကြိုက်သလို  မိမိဘလော့ Widget  နဲ့ ကိုက်ညီအောင် ချိန်းနိုင်ပါတယ်...

ဘလော့ခရီးသည်

www.aungsanmks.com

Blogger နည်းပညာများ,

Rate this posting:

{[['']]}

Posted in: Blogger နည်းပညာများ