Kp3နည္းပညာ၊၄ဝဝ၊ဘေလာ့မွာCSS3သံုးျပီးပိုစ္စလံုးေတြကိုအၾကီးအေသးေျပာင္းနည္း

KP-3နည္းပညာ၄၀၀ေျမာက္မွာႏွစ္သစ္နဲ႕အတူနည္းပညာသစ္ေလးမွ်ေဝေပးလိုက္ပါတယ္။ဒီနည္းပညာသစ္ကCSS3သံုးထားတာပါ။ဘေလာ့ပိုစ္စလံုးေတြကိုအၾကီးအေသး
ေျပာင္းရန္(TestResizer)သစ္ေလးပါ၊သံုးတဲ့သူေတြမရွိေသးဖူးလို႕ေျပာရင္မွားမယ္မထင္ပါဘူး။ဘေလာ့မိတ္ေဆြအားလံုးလည္းၾကိဳက္ၾကမယ္လို႕ေမ်ာ္လင့္ပါတယ္။ေအာက္မွာပံုနဲ႕
တကြသြားၾကည့္လို႕ရေအာင္DEMOလင့္ခ္ေလးေပးထားပါတယ္။ဘေလာ့မိတ္ေဆြအားလံုးကိုခင္မင္ေလးစားလွ်က္ေကပီသရီးမိသားစု
ႏွစ္သစ္အစပထမဆံုးနည္းပညာသစ္ေလးျဖစ္ပါတယ္။မသိေသးတဲ့ဘေလာ့မိတ္ေဆြေတြကိုဆက္လက္ျပီးအသိေပးေစခ်င္ပါတယ္။

မွတ္ခ်က္။ႏွစ္သစ္မွာနည္းပညာသစ္ေလးေတြအတတ္ႏိုင္ဆံုးျဖန္႕ေဝေပးသြားမွာျဖစ္ပါတယ္။ဒါေၾကာင့္အီးေမးလ္ကေနအျမန္ဆံုးသိႏိုင္ရန္ေအာက္ကGoogleFriendမွMenberဝင္ေစခ်င္

ပါတယ္။SignInလုပ္ေပးၾကပါ။ျပီးေတာ့အသစ္တင္တိုင္းပို႕ေပးပါ့မယ္အီးေမးလ္လိပ္စားေလးထားသြားဆိုတဲ့ေနရာမွာမိမိရဲ႕အီးေမးလ္လိပ္စာေတြကိုလဲထည့္ေပးဖို႕ပမေမ့ၾကပါနဲ႕လို႕ထပ္ေျပာ

ခ်င္ပါတယ္။

ဒီမွာ သြားၾကည့္လိုက္ပါ။ေအာက္ပံု

ကိုယ္ဟာကိုယ္မယံုၾကည္ရင္ BackUp အရင္လုပ္ေပးသင့္ပါတယ္။

၁။Design

၂။Edit HTML

၃။Expand Widget Templatesကိုအမွန္ျခစ္ေပးလိုက္ပါ။

၄။ေအာက္က Code ကိုရွာပါ။

]]></ b: skin>

၅။ေတြ႕ျပီဆုိရင္အေပၚမွာေအာက္က Code ကိုထည့္ေပးလိုက္ပါ။

.tsizernorm, .tsizerbig, .tsizerbigger, .tsizersmall {
      padding-top: 20px;
      -o-transition: font 2s ease-in;
      -moz-transition: font 2s ease-in;
      -webkit-transition: font 2s ease-in;   
}
.tsizersmall {
      font-size: 90%;
}
.tsizernorm {
      font-size: 100%;
}
.tsizerbig {
      font-size: 105%;
}
.tsizerbigger {
      font-size: 110%;
      font-weight: bold;
}
span.sizer {
      float: right; 
      text-align: center; 
      height: 20px; 
      width: 250px;
      margin: 0 10px 10px 0;
      background: #333366; 
      display: block; 
      font-size: 18px; 
      padding: 2px 10px; 
      color: #00CCFF; 
      text-shadow: 1px 1px 1px blue; 
      cursor: pointer; 
      border: 1px solid #eee;
      font-family: Times New Roman;    
      border-radius: 5px;
      -moz-border-radius: 5px;
      -webkit-border-radius: 5px;
      box-shadow: 1px 1px 6px #000;
      -moz-box-shadow: 1px 1px 6px #000;
      -webkit-box-shadow: 1px 1px 6px #000;display: block;
}
span.sizer:active {
      border: 1px solid #555;
      border-radius: 8px;
      -moz-border-radius: 8px;
      -webkit-border-radius: 8px;
      background: #003399;
      box-shadow:0px 0px 12px #000;
      -moz-box-shadow:0px 0px 12px #000;
      -webkit-box-shadow:0px 0px 12px #000;  
      margin-top: -1px;
} 
.clr20 {clear: both; height: 20px;}

၆။ေအာက္က Code ထပ္ရွာပါ။

<data:post.body/> 

၇။ေတြ႕ျပီဆိုရင္ေအာက္က Code နဲ႕အစားထိုေပးလိုက္ပါ။

<div class='tsizersmall' onclick='if (this.className==&quot;tsizersmall&quot;) { this.className=&quot;tsizernorm&quot; } else if (this.className==&quot;tsizernorm&quot;) { this.className=&quot;tsizerbig&quot; } else if (this.className==&quot;tsizerbig&quot;) { this.className=&quot;tsizerbigger&quot; } else if (this.className==&quot;tsizerbigger&quot;) { this.className=&quot;tsizersmall&quot; } else { this.className=&quot;tsizersnall&quot; }'><span class='sizer'>စလံုးအၾကီးအေသးေျပာင္းရန္</span>
<div class="clr20"/>
 
<data:post.body/>

</div>

၈။Save Tamplate ႏိုပ္လိုက္ပါရပါျပီ။ ။ ။

Credit = KP3-နည္းပညာ

( ::::: ပိုစ့္တင္သူ-ေခ်ာကိုကို ::::: )

ကၽြန္ေတာ္တင္သမွ် Post ေတြကို Facebook မွ တုိက္ရုိက္ဖတ္ရႈလို႔ပါက >> 

နည္းပညာႏွင့္ေဆာ့ဝဲလ္မ်ား Page ကိုႏွိပ္ျပီး Like လုပ္ထားေပးပါ၊၊ 

႐ိုး႐ွင္​း​ေသာနည္​းပညာမ်ားကို ဆန္​းသစ္​စြာတင္​ဆက္​မည္​။

အားလံုးကိုခင္​မင္​လ်ွက္​။

Admin & CKK - နည္​းပညာ