kp3နည္းပညာ၊၁၅၅၊Charm CSS Horizontal Menu သံုးခ်င္၇င္

အခုတင္တဲ႕ Post ေလးကလည္းCharm CSS Horizontal Menu လို႕ေခၚပါတယ္၊ဘေလာ့အတြက္
သံုးလို႕ေကာင္းတဲ့ Menu ေလးတခုပါဘဲ၊ Code ေတာ့အရမ္းကိုရွင္းပါတယ္၊သံုးခ်င္တဲ့ဘေလာ့မိတ္ေဆြ
ေတြအတြက္ေပါ႕ေနာ္၊နမူနာသြားၾကည့္လို႕ရေအာင္လည္း DEMO လင့္ခ္လည္းေပးထားပါတယ္...။။။။
ေအာက္မွာထည့္နည္းနဲ႕တကြပံု၊ဘေလာ့္မိတ္ေဆြအားလံုးကိုအဆင္ျမဲခ်စ္ခင္ေလးစားလၽွက္..kp3မိသားစု

                                                    DEMO
၁။Dashboard

၂။Layout

၃။Edit HTML

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

</head>

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

<style type='text/css'>

#menu {text-align:left;height:36px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2HNnmu_zut4HX5osEAVbDgzLj7rysI3VPvUVp3l3qY2CRFGJVmS3u9DVYDvHxzp9wrNrL6DSDfChh0KlcohPcBmKw_sJD3KPtPKjTVF6wgqp7tgTKvD-hGvUcAYoISuRAnzd2AnA8kWR-/) repeat-x top;padding:0px 10px 0px 10px;vertical-align: top;margin:0px 4px 0px 4px;}

#menu ul {height:36px; width:100%;overflow:hidden;}

#menu li {  font: 15px Arial, Helvetica, sans-serif; display: inline;  margin-right: 10px; padding:5px 0px 5px 0px; font-weight:bold; line-height:36px;height:36px;}

#menu li a {  color: #494949;  text-decoration: none;}

#menu li a:hover {color: #333;text-decoration: underline;}

</style>

၄။Save Template.ကိုႏိုပ္လိုက္ပါ၊

၅။Layout

၆။Page Elements

၇။Add a Gadget

၈။HTML/Javascript' သြားျပီးေအာက္က Code ကိုထည့္လိုက္ပါ၊

<div id="menu">

<ul>
 
<li><a href="မိမိရဲ႕ဒီမွာထည့္ပါ#" title="#">ေကပီသ၇ီး</a></li>

<li><a href="မိမိရဲ႕ဒီမွာထည့္ပါ#" title="#">သီခ်င္း</a></li>

<li><a href="မိမိရဲ႕ဒီမွာထည့္ပါ#" title="#">သတင္း</a></li>

<li><a href="မိမိရဲ႕ဒီမွာထည့္ပါ#" title="#">ဂ်ာနယ္</a></li>

<li><a href="မိမိရဲ႕ဒီမွာထည့္ပါ#" title="#">ဗီြဒီယို</a></li>

<li><a href="မိမိရဲ႕ဒီမွာထည့္ပါ#" title="#">အႏုပညာ</a></li>

<li><a href="မိမိရဲ႕ဒီမွာထည့္ပါ#" title="#">အားကစား</a></li>

<li><a href="မိမိရဲ႕ဒီမွာထည့္ပါ#" title="#">ဆက္သြယ္ရန္</a></li>

</ul>

</div>

၉။Save ႏိုပ္လိုက္ျပီးထားခ်င္တဲ့ေန၇ာမွာသြားထားၾကေတာ့၊က်ေနာ္မလိုက္ေတာ့ဘူးေနာ္-ဟီး.....


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

Related Post

Posted in: MENU