kp3နည္းပညာ၊၂၅၄၊ဘေလာ့မွာလြယ္ကူတဲ ့KP-3ရဲ ့Horizontal CSS menu ေလးထည့္နည္း

ေနာက္ပိုင္းMenu ေတြကိုဘဲတင္ေတာ့မယ္လို ့စိတ္ကူးတဲ့အခ်ိန္မွာလဲ အီးေမးလ္ကေနဟိုဟာေတာင္းဆိုဒါ ေတာင္းဆိုနဲ ့ဒါေၾကာင့္ဘာမွမတင္လိုက္မိဘူး။ ဒါေပမယ့္ Kp-3 မိသားစုရဲ ့စိတ္တိုင္းက်လုပ္ထားတဲ့ Menu ေတာ္ေတာ္မ်ားမ်ားလည္းတင္ျပီးသားရွိပါတယ္။အခုတင္တဲ့ဟာေလးကေတာ့Horizontal CSS menu လို ့ေခၚ ပါတယ္ေအာက္မွာသြားၾကည့္လို ့ရေအာင္လည္း DEMO လင့္ခ္ေလးေပးထားပါတယ္။ ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအဆင္ျမဲံခ်စ္ခင္ေလးစားလ်ွက္ kp-3မိသားစု

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

၁။ Layout

၂။Edit HTML

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

]]></b:skin>

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

#nav
{
    padding:0;
}

#nav li
{
    display:inline;
}

#nav li a
{  
   font-family:Arial;
   font-size:12px;
   text-decoration: none;
   float:left;
   padding:10px;
   background-color: #333333;
   color:#ffffff;
   border-bottom:1px;
   border-bottom-color:#000000;
   border-bottom-style:solid;
}


#nav li a:hover
{
   background-color:#9B1C26;
   padding-bottom:12px;
   border-bottom:2px;
   border-bottom-color:#000000;
   border-bottom-style:solid;
   margin:-1px;
}

၃။Save Template ေအာက္က Code Layout>>>Add a Gadget>>>HTML/JavaScript Add ထည့္ေပးလိုက္ပါ။

<ul id="nav">
    <li><a href="http://kp3family.blogspot.com#">kp3မိသားစု</a></li>
    <li><a href="http://kp3family.blogspot.com#">ဆက္သြယ္ရန္</a></li>
    <li><a href="http://kp3family.blogspot.com#">နည္းပညာ</a></li>
    <li><a href="http://kp3family.blogspot.com#">သတင္း</a></li>
    <li><a href="http://kp3family.blogspot.com#">သီခ်င္းမ်ား<</a></li>
    <li><a href="http://kp3family.blogspot.com#">အားကစား</a></li>
    <li><a href="http://kp3family.blogspot.com#">အလုပ္အကိုင္</a></li>
</ul>

၄။Save ႏိုပ္လိုက္ပါ။ျပီးပါျပီ။ ။

မွတ္ခ်က္။ ။kp3family ႏွင့္ kp3လင့္ခ္ေတြကိုမိမိရဲ ့လင့္ခ္ေတြနဲ ့အစားထိုးေပးလိုက္ပါ။

မသိေသးတဲ႔မိတ္ေဆြေတြကိုအသိေပးမ်ွေဝေစခ်င္ပါတယ္၊
ဘေလာ့ဂါမိတ္ေဆြအားလံုးကိုအစဥ္ျမဲခ်စ္ခင္ေလးစားလၽွက္ kp3မိသားစု

Related Post

MENU

• Kp3နည္းပညာ၊၄၈၅၊AUniqueStyleDropDownBarNavigationMenuသံုးခ်င္ရင္
• Kp3နည္းပညာ၊၄၇၅၊ဘေလာ့မွာFacebookStyleDropDownMenuသံုးခ်င္ရင္
• Kp3နည္းပညာ၊၄၇၂၊ဘေလာ့မွာအလြယ္ကူဆံုး Accordion Menu သံုးခ်င္ရင္
• Kp3နည္းပညာ၊၄၇၁၊ဘေလာ့မွာCSS3 Multi Level Drop Down Menu သံုးနည္း
• Kp3နည္းပညာ၊၄၃ဝ၊Kp-3 Blue Tabbed Drop Down
• Kp3နည္းပညာ၊၄၂၆၊Kp-3 Grey Impression Drop Down Menu
• Kp3နည္းပညာ၊၄၂၅၊Kp-3 Green Impression Drop Down Menu
• Kp3နည္းပညာ၊၄၂၄၊Kp-3 Blue Impression Drop Down Menu
• Kp3နည္းပညာ၊၄၂၃၊Kp-3 Blue Center Drop Bar Menu
• Kp3နည္းပညာ၊၄၂ဝ၊Kp-3 Sunrise Gloss Drop Down Menus
• Kp3နည္းပညာ၊၄၁၉၊Kp-3 Massive Blue Drop Down menu
• Kp3နည္းပညာ၊၃၉၃၊ဘေလာ့မွာ KP-3CSS Horizontal Navigation Menuသံုးခ်င္ရင္
• Kp3နည္းပညာ၊၃၉၂၊ဘေလာ့မွာ KP-3Horizontal Double Line Menu သံုးခ်င္ရင္
• Kp3နည္းပညာ၊၃၆၃၊Kp-3 ရဲ႕ Vertical Dropdown Menu ေလးသံုးခ်င္ရင္
• Kp3နည္းပညာ၊၃၅၉၊ဘေလာ့မွာKp-3 Tab Menu ေလးသံုးခ်င္ရင္
• kp3နည္းပညာ၊၃၁၉၊ဘေလာ့မွာ KP-3Horizontal ေလးထည့္နည္း
• kp3နည္းပညာ၊၃၁၂၊KP-3 ရဲ႕ HORIZONTAL MENU အသစ္ေလးသံုးခ်င္ရင္
• kp3နည္းပညာ၊၂၉၇၊ဘေလာ့မွာ kp-3 ရဲ႕ Menu အသစ္ေလးသံုးခ်င္ရင္
• kp3နည္းပညာ၊၂၆၇၊ဘေလာ့အတြက္ KP-3 Horizontal Tabs Menu ေလးထည့္နည္း
• kp3နည္းပညာ၊၂၅၁၊ဘေလာ့မွာ KP-3 ရဲ႕ Horizontal Menu အသစ္ေလးသံုးခ်င္၇င္
• kp3နည္းပညာ၊၂၅၀၊ဘေလာ့မွာ KP-3 ရဲ႕ Drop Down Menu အသစ္ေလးသံုးခ်င္၇င္
• kp3နည္းပညာ၊၂၄၂၊ဘေလာ့မွာ Dancing Links လို႕ေခၚတဲ့ Jquery Link Nudging ေလးသံုးနည္း
• kp3နည္းပညာ၊၂၄၁၊ဘေလာ့မွာ CSS-driven tabs Menu ေလးထည့္နည္း
• kp3နည္းပညာ၊၂၁၇၊ဘေလာ့မွာNAVIGATION BUTTONS Menu ေလးသံုးခ်င္ရင္

Posted in: MENU