မုဒံုဝိုင္းေအာင္နည္းပညာ၊ဘေလာ့မွာNAVIGATION BUTTONS Menu ေလးသံုးခ်င္ရင္

ဘေလာ့မွာလြယ္ကူတဲ့ NAVIGATION BUTTONS Menu ေလးသံုးခ်င္တဲ့ဘေလာ့မိတ္ေဆြေတြအတြက္ အရမ္းလည္းရွင္းပါတယ္၊ ေအာက္မွာဥပမာပံုေလးလည္းျပထားေပးပါတယ္။ သြားၾကည့္လို့ရေအာင္လည္း DEMO လင့္ခ္ေလးပါထားေပးပါတယ္။ေအာက္မွာထည့္နည္းေလးနဲ့တကြပံု

                                                                 

၁။ Layout

၂။Edit HTML

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

1. ]]></b:skin>  

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

1. ul#list-nav {  
2. list-style:none;  
3. margin:5px;  
4. padding:0;  
5. width:510px  
6. }  
7. ul#list-nav li {  
8. display:inline  
9. }  
10. ul#list-nav li a {  
11. text-decoration:none;  
12. padding:5px 0;  
13. width:100px;  
14. background:#333;  
15. color:#eee;  
16. floateft;  
17. text-align:center;  
18. border-left:1px solid #fff;  
19. }  
20. ul#list-nav li a:hover {  
21. background:#00FF00;  
22. color:#6600CC;  
23. }  

ေနာက္တဆင့္

၃။Layout

၄။Add a Gadget

၅။HTML/JavaScript Add မွာေအာက္က Menu Code ေတြမိမိထားခ်င္သည့္ေန၇ာမွာထည့္ေပးလိုက္ပါ။

1. <ul id="list-nav">  
2. <li><a href="ဤေနရာမွာလင့္ခ္ထည့္ပါ#">မုူလစာမ်က္နာ</a></li>  
3. <li><a href="ဤေနရာမွာလင့္ခ္ထည့္ပါ#">သတင္း</a></li>  
4. <li><a href="ဤေနရာမွာလင့္ခ္ထည့္ပါ#">အႏုပညာ</a></li>  
5. <li><a href="ဤေနရာမွာလင့္ခ္ထည့္ပါ#">အားကစား</a></li>  
6. <li><a href="ဤေနရာမွာလင့္ခ္ထည့္ပါ#">နည္းပညာမ်ား</a></li>  
7. <li><a href="ဤေနရာမွာလင့္ခ္ထည့္ပါ#">ဘေလာ့ဂါ</a></li>  
8. <li><a href="ဤေနရာမွာလင့္ခ္ထည့္ပါ#">ဗဟုသုတ</a></li>  
9. <li><a href="ဤေနရာမွာလင့္ခ္ထည့္ပါ#">ဆက္သြယ္ရန္</a></li>  
10. </ul>  

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