ဤဘေလာ့ကို
http://technohalo.com
သို႔ေျပာင္းလဲထားပါတယ္ခင္ဗ်ာ။ ပို႔စ္အသစ္မ်ားကိုလည္း ထိုဘေလာ့တြင္ ဆက္လက္ေရးသားသြားပါမည္ျဖစ္ေၾကာင္း။
ေက်းဇူးတင္ပါတယ္ခင္ဗ်ာ။
လိပ္စာေျပာင္းထားျခင္း
English book စာအုပ္မ်ား
ဟုတ္ကဲ႔ ခင္ဗ်ာ ဒီစာအုပ္ေလးက Grammar reference and practice intermediate စာအုပ္ေလးပါ ခင္ဗ်ာ Answers မ်ားပါ ၁ခုခ်င္း ေဖာ္ၿပထားပါတယ္ ခင္ဗ်ာ.....practice လုပ္ခ်င္သူမ်ား အတြက္အဆင္ေၿပပါလိမ္႔မည္ ခင္ဗ်ာ...............
ေဟာ႔ ဒီမွာ ယူပါခင္ဗ်ာ........... (or) http://www.mediafire.com/?myttwg3ld4u
***********************************************************************************
ဟုတ္ကဲ႔ခင္ဗ်ာ ဒီစာအုပ္ေလးက Grammar စာအုပ္ေလးပါခင္ဗ်ာ။ Self-study ေလ႔လာလို႔ရပါတယ္ ခင္ဗ်ာ။ ေကာင္းမေကာင္းကေတာ႔ ကိုယ္တိုင္ဖတ္ၾကည္႔ပါ ခင္ဗ်ာ...............
ဟုတ္ကဲ႔ ဒီမွာ ယူပါခင္ဗ်ာ..............(or) http://www.mediafire.com/?gyyqqt5dtq2
***********************************************************************************
Vocabulary နဲ႔ပတ္သက္တဲ႔ စာအုပ္ေလးပါ ခင္ဗ်ာ. english စာမွာ Vocabulary ဟာအေရးပါတဲ႔ အခန္းက ပါ၀င္ပါတယ္ ခင္ဗ်ာ.ဒါေၾကာင္႔တင္ေပးလိုက္ၿခင္းၿဖစ္ပါတယ္ ခင္ဗ်ာ............
စာအုပ္ကို ဒီမွာ ယူပါခင္ဗ်ာ.................(or) http://www.mediafire.com/?zmmmzyyytmu
***********************************************************************************
Vocabulary နဲ႔ပတ္သက္တဲ႔ ဒုတိယစာအုပ္ေလးပါ ခင္ဗ်ာ. ထပ္တင္ေပးလိုက္ၿခင္းၿဖစ္ပါတယ္ ခင္ဗ်ာ............
စာအုပ္ကို ဒီမွာ ယူပါခင္ဗ်ာ...........(or) http://www.mediafire.com/?v2jnzkutjg1
မိတ္ေဆြ............သင္တကယ္မရရွိခဲ့တဲ့ အရာအားလံုးဟာ သင္တကယ္မလုိခ်င္ခဲ့လုိ႔ပါဘဲ။
C++ အိမ္စာမ်ား(၁၃)
ဒီတစ္ခါ တင္ဆက္မွာကေတာ့ စက္၀ိုင္းတစ္ခုနဲ႔ မ်ဥ္းတစ္ေၾကာင္းတို႔ ဘယ္မွာျဖတ္မလဲဆိုတာကို ရွာဖို႔ပါေရးထားတာကိုပဲ ေအာက္မွာျပထားတဲ့ ပံုသံုးပံုနဲ႔ တိုက္စစ္ျပပါမယ္ခင္ဗ်ာ
ဒီသံုးပံုမွာ နမူနာအျဖစ္ စက္၀ိုင္းေတြကို စင္တာမွတ္ (0,0) နဲ႔ အခ်င္း၀က္ ၅ ထားလိုက္ပါတယ္။ အနီေရာင္နဲ႔ျပထားပါတယ္။ အျပာေရာင္လိုင္းကို ထုတ္ေပးမယ့္ အမွတ္ေတြကို အျပာနဲ႔ျပျပီး၊ ျဖတ္မွတ္အေျဖေတြကိုေတာ့ အစိမ္းနဲ႔ျပထားပါတယ္။
ထည့္ေပးရမယ့္အမွတ္ေတြက စက္၀ိုင္း ဗဟို (xy coordinate )အတြက္ a နဲ႔ b အခ်င္း၀က္ r မ်ဥ္းေၾကာင္းအတြက္ စမွတ္ ဆံုးမွတ္ xy coordinate ႏွစ္စံုတို႔ျဖစ္ပါတယ္။
ထုတ္ေပးမယ့္အေျဖက ျဖတ္ရင္ ဘယ္အမွတ္မွာ ျဖတ္မယ္ဆိုတာနဲ႔ မျဖတ္ရင္ မျဖတ္ဘူးပါ။
နမူနာသံုးပံုမွာေတာ့ ပထမပုစၦာအတြက္ ႏွစ္ေနရာျဖတ္လို႔ ႏွစ္မွတ္ ထုတ္ေပးရပါမယ္။
ဒုတိယပုစၦာအတြက္ တစ္ေနရာပဲ ျဖတ္လို႔ တစ္မွတ္သာထုတ္ေပးဖို႔လိုျပီး၊ တတိယပုစၦာမွာေတာ့ ျဖတ္မွတ္မရွိေၾကာင္းအေျဖေပးႏိုင္ရမွာျဖစ္ပါတယ္။
အဲဒီပုစၦာသံုးပုဒ္အတြက္ အေျဖေတြကေတာ့ ...
(၁) ႏွစ္မွတ္အေျဖထုတ္ေပးပါတယ္။ အေပၚက ပံုနဲ႔ ယွဥ္တြဲၾကည့္ႏိုင္ပါတယ္။
(၂)ျဖတ္မွတ္ တစ္မွတ္သာရွိပါတယ္။ ပံုနဲ႔တြဲၾကည့္ပါ။
(၃) ျဖတ္မွတ္မရွိပါခင္ဗ်ာ။ ယာဘက္ဆံုးပံုအတိုင္းျဖစ္ပါတယ္။
မ်ဥ္အီေကြရွင္းျဖစ္တဲ့ y=mx+c နဲ႔ m=(y2-y1)/(x2-x1) တို႔နဲ႔အတူ၊
စက္၀ိုင္းအီေကြရွင္းျဖစ္တဲ့ (x-a)^2+(y-b)^2=r^2 တို႔ကိုသံုးထားတာျဖစ္ပါတယ္။
ပရိုဂရမ္အရေတာ့ မရႈပ္ပါဘူး။ သခၤ်ာအေတြးက အဓိကပါ။
အလွ်ားလိုက္မ်ဥ္းအတြက္ slope က 0 ျဖစ္လို႔ ျပႆနာမျဖစ္ေပမယ့္၊ ေဒါင္းလိုက္မ်ဥ္းမွာေတာ့ slope က ျပႆနာေပးပါေတာ့တယ္။ m=(y2-y1)/0 ျဖစ္လို႔ပါ။ အဲဒီျပႆနာအတြက္ ကြၽန္ေတာ္ ၂ ဆေရးလိုက္ရပါတယ္။ ေက်ာင္းသားမ်ားအေနနဲ႔ ဖတ္ရလြယ္ကူေအာင္လို႔ အမွတ္ေတြကို အတတ္ႏိုင္ဆံုးသီးသန္႔ ခြဲျခားေရးေပးလိုက္ပါတယ္။ ေနာင္မွာလည္း ဆက္လက္ေရးေပးပါဦးမယ္။ ကြၽန္ေတာ္ဆီမွာ စိတ္၀င္စားစရာပရိုဂရမ္ေတြ က်န္ပါေသးတယ္ခင္ဗ်ာ။
#include <iostream.h>
#include <conio.h>
#include <math.h>
void main()
{
double a,b,r,x1,y1,x2,y2,m,c,i,j,k,d,x11,y11,x22,y22,x,y;
cout<<"General equation of circle: (x-a)*(x-a)+(y-b)*(y-b)=r*r";cout<<endl;
cout<<"Generel equation of line: y=m*x+c where m=(y2-y1)/(x2-x1)";cout<<endl;cout<<endl;
cout<<"x-coordinate of center of circle a=";cin>>a;cout<<endl;
cout<<"y-coordinate of center of circle b=";cin>>b;cout<<endl;
cout<<"radius of circle r=";cin>>r;cout<<endl;
cout<<"x-coordinate of first point of line x1=";cin>>x1;cout<<endl;
cout<<"y-coordinate of first point of line y1=";cin>>y1;cout<<endl;
cout<<"x-coordinate of second point of line x2=";cin>>x2;cout<<endl;
cout<<"y-coordinate of second point of line y2=";cin>>y2;cout<<endl;
if ((x2-x1)==0)
{ x=x1;
i=1;
j=(-2*b);
k=x*x-2*a*x+a*a+b*b-r*r;
d=j*j-(4*i*k);
cout<<"Equation of the given line:"<<"x="<<x;cout<<endl;
cout<<"Equation of given circle: (x-"<<a<<")*(x-"<<a<<")+(y-"<<b<<")*(y-"<<b<<")="<<r*r;cout<<endl;cout<<endl;
if (d>0)
{y11=(-j+sqrt(d))/(2*i);
y22=(-j-sqrt(d))/(2*i);
x11=x;
x22=x;
cout<<"Coordinate of first point of intersection= ("<<x11<<","<<y11<<")";cout<<endl;
cout<<"Coordinate of second point of intersection= ("<<x22<<","<<y22<<")";cout<<endl;}
if (d==0)
{y=(-j)/(2*i);
cout<<"Coordinate of point of intersection= ("<<x<<","<<y<<")";cout<<endl;}
if (d<0)
{cout<<"No point of intersection";}
}
else
{ if (d>0)
m=(y2-y1)/(x2-x1);
c=y1-m*x1;
cout<<"Equation of the given line:"<<"y="<<m<<"*x+"<<c;cout<<endl;
cout<<"Equation of given circle: (x-"<<a<<")*(x-"<<a<<")+(y-"<<b<<")*(y-"<<b<<")="<<r*r;cout<<endl;cout<<endl;
i=(1+m*m);
j=(-2*a+2*m*c-3*b*m);
k=a*a-2*c*b+b*b+c*c-r*r;
d=j*j-(4*i*k);
if (d>0)
{x11=(-j+sqrt(d))/(2*i);
x22=(-j-sqrt(d))/(2*i);
y11=m*x11+c;
y22=m*x22+c;
cout<<"Coordinate of first point of intersection= ("<<x11<<","<<y11<<")";cout<<endl;
cout<<"Coordinate of second point of intersection= ("<<x22<<","<<y22<<")";cout<<endl;}
if (d==0)
{x=(-j)/(2*i);
y=m*x+c;
cout<<"Coordinate of point of intersection= ("<<x<<","<<y<<")";cout<<endl;}
if (d<0)
{cout<<"No point of intersection";}
}
getch();
}
C++ အိမ္စာမ်ား(၁၂)
အခုတင္ျပေပးမွာကေတာ့ သုညကေန ၁၀၀ အတြင္ Random ေခါက္ထားတာေလးကို ၾကီးစဥ္ငယ္လိုက္စီတာနဲ႔ ငယ္စဥ္ၾကီးလိုက္စီတာေလးပဲျဖစ္ပါတယ္။
#include<iostream.h>
#include<stdlib.h>
#include<conio.h>
void main()
{
int str[10],i,j,k,temp;
cout<<"The given String=";
for(k=0;k<10;k++)
{str[k]=rand()%100;
cout<<' '<<str[k];
}
cout<<endl;
cout<<"Decending order=";
for(i=0;i<10;i++)
{for(j=0;j<9-i;j++)
{if(str[j]>str[j+1])
{temp=str[j];
str[j]=str[j+1];
str[j+1]=temp;
}
}cout<<">"<<str[j];
}
getch();
}
ဒါေလးကို ရမ္းလိုက္မယ္ဆိုရင္ ရလာမွာကေတာ့ ေအာက္ကပံုအတိုင္း (ၾကီးစဥ္ငယ္လိုက္) ဆင္တူျဖစ္ပါ့မယ္။
#include<iostream.h>
#include<stdlib.h>
#include<conio.h>
void main()
{
int str[10],i,j,k,temp;
cout<<"The given String=";
for(k=0;k<10;k++)
{str[k]=rand()%100;
cout<<' '<<str[k];
}
cout<<endl;
cout<<"Decending order=";
for(i=0;i<10;i++)
{for(j=0;j<9-i;j++)
{if(str[j]<str[j+1])
{temp=str[j];
str[j]=str[j+1];
str[j+1]=temp;
}
}cout<<"<"<<str[j];
}
getch();
}
#include<stdlib.h>
#include<conio.h>
void main()
{
int str[10],i,j,k,temp;
cout<<"The given String=";
for(k=0;k<10;k++)
{str[k]=rand()%100;
cout<<' '<<str[k];
}
cout<<endl;
cout<<"Decending order=";
for(i=0;i<10;i++)
{for(j=0;j<9-i;j++)
{if(str[j]<str[j+1])
{temp=str[j];
str[j]=str[j+1];
str[j+1]=temp;
}
}cout<<"<"<<str[j];
}
getch();
}
C++ အိမ္စာမ်ား(၁၁)
ဒီေမးခြန္းကေတာ့ မေန႔ကမွ ကၽြန္ေတာ္ေရးျဖစ္တာေလးပါ။ ေမးခြန္းေလးက လွပါတယ္။
((((1?2)?3)?4)?5)?6=35 ဆိုတာေလးကို တြက္ခိုင္းတာပါ။ ? ေနရာေလးမွာ +-*/ ၾကိဳက္ရာျဖစ္လို႔ ရပါတယ္တဲ့။ အဲဒါကို C++ နဲ႔ တြက္ေပးပါလို႔ ဆိုလာပါတယ္။ ကၽြန္ေတာ္က ေအာက္ပါအတိုင္းေရးျပလိုက္ပါတယ္။ ဆရာမကေတာ့ switch နဲ႔ ေရးလည္း ရတယ္ဆိုပါတယ္။ ကၽြန္ေတာ္ကေတာ့ for နဲ႔ if ကိုပဲသံုးေရးလိုက္ပါတယ္။
ရလာမယ့္အေျဖကေတာ့ ၃ မ်ိဳးရွိပါတယ္။ ေအာက္ကဟာေလးကို run လိုက္ပါခင္ဗ်။
#include<iostream.h>
#include<conio.h>
#include<math.h>
void main()
{
int result; int x,y,z,p,q;
for(x=0;x<4;x++){
for(y=0;y<4;y++){
for(z=0;z<4;z++){
for(p=0;p<4;p++){
for(q=0;q<4;q++){
if(x==0)result=1+2;
if(x==1)result=1-2;
if(x==2)result=1*2;
if(x==3)result=1/2;
if(y==0)result=result+3;
if(y==1)result=result-3;
if(y==2)result=result*3;
if(y==3)result=result/3;
if(z==0)result=result+4;
if(z==1)result=result-4;
if(z==2)result=result*4;
if(z==3)result=result/4;
if(p==0)result=result+5;
if(p==1)result=result-5;
if(p==2)result=result*5;
if(p==3)result=result/5;
if(q==0)result=result+6;
if(q==1)result=result-6;
if(q==2)result=result*6;
if(q==3)result=result/6;
if(result==35)
{
cout<<"(((((1";
if(x==0)cout<<"+";
if(x==1)cout<<"-";
if(x==2)cout<<"*";
if(x==3)cout<<"/";
cout<<"2)";
if(y==0)cout<<"+";
if(y==1)cout<<"-";
if(y==2)cout<<"*";
if(y==3)cout<<"/";
cout<<"3)";
if(z==0)cout<<"+";
if(z==1)cout<<"-";
if(z==2)cout<<"*";
if(z==3)cout<<"/";
cout<<"4)";
if(p==0)cout<<"+";
if(p==1)cout<<"-";
if(p==2)cout<<"*";
if(p==3)cout<<"/";
cout<<"5)";
if(q==0)cout<<"+";
if(q==1)cout<<"-";
if(q==2)cout<<"*";
if(q==3)cout<<"/";
cout<<"6)";
cout<<"=35";
cout<<endl;}
}}}}}
getch();
}
ရလာမွာေလးကေတာ့ ေအာက္ပံုေလးအတိုင္း အေျဖထြက္လာပါလိမ့္မယ္ခင္ဗ်။
အိမ္စာအပုဒ္ေပါင္းမ်ားစြာ က်န္ရွိေနပါေသးတယ္။ ဆက္လက္ေဖၚျပေပးပါ့မယ္ခင္ဗ်။
C++ အိမ္စာမ်ား(၁၀)
အေၾကာင္းေၾကာင္းေၾကာင့္ ပိုစ့္မတင္ျဖစ္တာၾကာျပီမို႔ စေရးရမွာေတာင္ တြန္႔ဆုတ္ဆုတ္ျဖစ္ေနတယ္ဗ်ာ။
အိမ္စာေလးေတြကို ဆက္ေရးၾကပါစို႔ခင္ဗ်။
ပုစၦာကေတာ့ ရုရွားဘာသာစကားနဲ႔ ျဖစ္တာမို႔ ဗမာလိုပဲ တင္ျပလိုက္ပါတယ္။
?1022? ဆိုတဲ့ ဂဏန္းေလးကို အကယ္၍ ၇ ၈ ၉ နဲ႔ စားလို႔ျပတ္မယ္ဆိုရင္ ? ေနရာမ်ားကို ကိန္းတစ္ခု အစားထိုးမယ္မယ္ဆိုရင္ ထိုကိန္းဂဏန္းဟာ ဘာပါလဲလို႔လည္း ေမးထားပါတယ္။
#include<iostream.h>
#include<conio.h>
void main()
{
long i,j,k;
for (int i=0; i<10; i++)
for (int j=0; j<10; j++)
{
k=(100000*i+1022*10+j);
if(k%7==0&&k%8==0&&k%9==0)
cout<<"the answer="<<k;
}
getch();
}
#include<conio.h>
void main()
{
long i,j,k;
for (int i=0; i<10; i++)
for (int j=0; j<10; j++)
{
k=(100000*i+1022*10+j);
if(k%7==0&&k%8==0&&k%9==0)
cout<<"the answer="<<k;
}
getch();
}
အေျဖကေတာ့ the answer=910224 ျဖစ္ပါတယ္ခင္ဗ်ာ။
ရွင္းလင္းခ်က္။ ။ဒီပုစၦာမွာ အဓိက ေသာ့ခ်က္က ေနရာလိုက္ ကိန္းေတြရဲ႕ တန္ဖိုးပါ။ k=(100000*i+1022*10+j); ဒါေလးကို အရင္ စဥ္းစားႏိုင္မွ ျဖစ္ပါမယ္။ i နဲ႔ j တို႔ေနရာဟာ 0 ကေန 9 အထိ ၁၀ လံုးရွိေနမယ္ဆိုရင္ေလး အရင္ေတြးႏိုင္မွ ျဖစ္ပါမယ္။ စားလို႔ျပတ္တယ္ဆိုတာဟာ အၾကြင္း သုညျဖစ္တာကို သိထားေတာ့ အၾကြင္းကို % နဲ႔ သံုးရွာျပီး သုညနဲ႔ ညီေတာ့ စားလို႔ျပတ္တာေပါ့ခင္ဗ်ာ။ သံုးလံုးေတာင္ တစ္ျပိုင္တည္းျပတ္ခ်င္ေတာ့ ၾကားထဲမွာ && ေလးေတြ ခံေရးလိုက္ျပီး စစ္ခိုင္းေတာ့ အေျဖရျပီေပါ့ခင္ဗ်ာ။
ဘေလာ့ေခါင္းစဥ္ခြဲပံုေလး
ကြၽန္ေတာ့္ဘေလာ့က ေခါင္းစဥ္ခြဲေလးေတြက်လာပံုကို သေဘာက်လို႔ ေမးျမန္းသူ ၄ ေယာက္ေလာက္ရွိပါတယ္။ ေလာေလာဆယ္ ညီေလးကိုငယ္လည္း ေတာင္းတာေၾကာင့္ တတ္သေလာက္ မွတ္သေလာက္ တင္ျပလိုက္ပါတယ္ခင္ဗ်ာ။ တင္ၾကိဳေျပာျပထားလိုတာက ကြၽန္ေတာ္က html အေၾကာင္း ေကာင္းစြာ မေလ့လာပါဖူးပါ။ template ၃ခု ၄ခု ေလာက္ထဲက စိတ္ထင္တာေတြ ျဖတ္ထည့္ရင္း၊ သူမ်ားကိုလည္း ေမးျမန္းရင္း ျပင္ျပီးရင္းျပင္ရင္း လုပ္ေနခဲ့တာ အေရာင္မ်ိဳးစံုေျပာင္းကာ လူျမင္ကတ္စရာျဖစ္ခဲ့ၾကိမ္ေပါင္း မနည္းပါဘူး။ ဒီပံုစံေလးကေတာ့ စာဖတ္သူမ်ား စာရွာရလြယ္မယ့္ menu ပံုစံေလးျဖစ္မယ္လို႔ေတာ့
ယံုၾကည္လွ်က္ပါ။ ဒီပံုစံေလးကိုေျပာတာပါခင္ဗ်။
့
html code မွာထည့္ရမယ့္ ေနရာနဲ႔ပံုစံ ႏွစ္မ်ိဳးရွိပါတယ္။
* ၁)ပံုစံခ်ရန္
html code မွာ ေအာက္ပါအတိုင္း ထည့္ရန္ေနရာရွာပါခင္ဗ်။
#header-wrapper {
width:985px;
height: 210px;
margin:0 0 0px;
ခ်ံဳ႕လိုက္ပါတယ္
color: #ffffff;
text-align: right;
}
#header img {
margin-left: auto;
margin-right: auto;
}
----------------------------------------------- */
#outer-wrapper {
width: 980px;
margin:0 auto;
padding:0px;
text-align:left;
font: normal normal 100% Zawgyi-one,Georgia, Serif;
ထည့္ရမယ့္ေနရာကို ရွာျပီးျပီဆိုရင္ ေအာက္ပါအစိမ္းေရာင္ ကုဒ္မ်ားအားေရြးထည့္ပါခင္ဗ်ာ။
ဒီအေပၚကအပိုဒ္မွာ 30px အရ အနိမ့္အျမင့္ညွိျပီး၊ background ကို အေရာင္ခ်ည္းသက္သက္ လုပ္လိုပါက backgroung: #000000; ဆိုျပီး အနက္ေရာင္ခင္းလိုက္ႏိုင္ပါတယ္။ အေရာင္ကုဒ္မ်ားအတြက္ အနက္ 000000၊ အျဖဴ ffffff နဲ႔ အျခားအေရာင္မ်ားကို cbox.ws က edit style မွာ စိတ္ၾကိဳက္ ရွာႏိုင္ပါတယ္ခင္ဗ်။ http://img52.imageshack.us/img52/7321/titv.png
လင့္ေနရာမွာေတာ့ စိတ္ၾကိဳက္ ပံုတင္ႏိုင္ပါတယ္။ ကြၽန္ေတာ္ကေတာ့ window theme ေတြကို print Screen ရိုက္ျပီး paint မွာ pixel ခ်ိန္ျပီး http://imageshack.us မွာ တင္ျပီး လင့္ယူပါတယ္ခင္ဗ်။ border အတြက္လည္း border-bottom:1px solid #162400; ဆိုရာမွာ ထက္ေအာက္ဘယ္ညာအတြက္ border-top: border-left: border-right: စသည္ျဖင့္ျပင္ႏိုင္ျပီး တစ္ပတ္လံုးအတြက္ border: အထူအက်ဲ px တန္ဖိုးျပင္ျပီး solid သုိ႔မဟုတ္ dotted ေျပာင္းႏိုင္ျပီး # ေနာက္က အေရာင္ပါ စိတ္ၾကိဳက္ေျပာင္းႏိုင္ပါတယ္ခင္ဗ်ာ။
ဒီအေပၚက color: #38B63C; ကေတာ့ လက္ရွိျမင္ေနရတဲ့ ေခါင္းစဥ္စိမ္းေတြ ျဖစ္ပါတယ္ခင္ဗ်။ bold မလုပ္ခ်င္က normal ေပးထားႏိုင္ပါတယ္ခင္ဗ်။ padding: 4px 10px 6px 10px; အရ စာလံုးေလးေတြကို ကြၽန္ေတာ္တို႔ လုပ္ထားတဲ့ ဧရိယာအရ ထက္ေအာက္ ဘယ္ညာ ဘယ္ေလာက္ခြာဦးမယ္ဆိုတာကိုလည္း ညွိယူလို႔ရပါတယ္ခင္ဗ်။
hower ဆိုတဲ့အေပၚပိုဒ္ကေတာ့ ကလစ္ခ်စဥ္မွာ ျမင္ရတာကို ျပင္တာျဖစ္ပါတယ္။ ကလစ္ခ်စဥ္မွာ အသည္းပံုေလးေတြ အတန္းလိုက္ေပၚခ်င္ရင္ အသည္းပံုေသးေလး တင္ျပီး repeat-x ေပါ့ဗ်ာ။ ဒီမွာေတာ့ အေပၚေအာက္အျဖဴေလး ကြၽန္ေတာ္လုပ္ျပီး အတန္းလိုက္ထားပါတယ္။ http://img19.imageshack.us/img19/8690/2222ec.pngကြၽန္ေတာ္ကေတာ့ Cursor ခ်စဥ္မွာ စာလံုးကို အျဖဴေရာင္ ေပၚခိုင္းထားလို႔ color: #ffffff; ျဖစ္ေနတာပါခင္ဗ်။
ဒီအေပၚက ပံုျဖစ္တဲ့ http://img62.imageshack.us/img62/6821/subtit.png ကို ဖြင့္ၾကည့္ျပီး သူ႔ေနရာမွာ အျခားပံုမ်ားနဲ႔ အစားသြင္းျပီး ေအာက္ကို ဆင္းက်လာမယ့္ စာတန္းေနာက္ခံကို ျပင္ႏိုင္ပါတယ္ခင္ဗ်။ စာတန္းအေရာင္ေရာ အက်ယ္ width ကိုပါ ျပင္ႏိုင္ပါျပီခင္ဗ်။
အေပၚပိုဒ္မွာကေတာ့ အသစ္ေပၚလာတဲ့ ပိုစ့္ေလးေတြေပၚကို Cursor ခ်စဥ္မွာ ျမင္ရမယ့္ စာလံုးအေရာင္နဲ႔ ေနာက္ခံ အေရာင္(ပံု) တို႔ကို ျပင္ႏိုင္ဖို႔ ျဖစ္ပါတယ္ခင္ဗ်ာ။ http://img189.imageshack.us/img189/774/subtit2.png
ဤတြင္ ကြၽန္ေတာ္တို႔ရဲ႕ ေခါင္းစဥ္ပံုစံခ်လို႔ ျပီးပါျပီခင္ဗ်။
* ၂) ေခါင္းစဥ္စီရန္
html code မွာ ေအာက္ပါအတိုင္း ထည့္ရန္ေနရာရွာပါခင္ဗ်။
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='4' showaddelement='yes'>
<b:widget id='Header1' locked='true' title='နကၡတ္ေဗဒင္မွတ္စုမ်ား (Header)' type='Header'/>
</b:section>
<ul id='menu'>
</ul>
</div>
<div id='content-wrapper'>
<div id='crosscol-wrapper' style='text-align:center'>
<b:section class='crosscol' id='crosscol' showaddelement='no'/>
</div>
<div id='main-wrapper'>
ထည့္ရမယ့္ ပံုစံကေတာ့ ေအာက္ကျပထားတဲ့ အနီေရာင္ေတြျဖစ္ပါတယ္ခင္ဗ်ာ။
<li><a href='#' title='Cursorတင္စဥ္ ေပၚလာမည့္စာသား'>ေခါင္းစဥ္(၁)</a>
ဤေနရာမွာ ေခါင္းစဥ္ အသစ္တိုးလိုပါက
စသည္ျဖင့္တိုးႏိုင္ပါတယ္။ ပို႔စ္(၁၀)(၁၁) နဲ႔ (၁၂)တိုးပံုကို သတိျပဳ၍ ထပ္မံတိုးခ်ဲ႕လိုက္ႏိုင္ေၾကာင္းပါခင္ဗ်ာ။
ပံုစံနမူနာကေတာ့
ယံုၾကည္လွ်က္ပါ။ ဒီပံုစံေလးကိုေျပာတာပါခင္ဗ်။
့
html code မွာထည့္ရမယ့္ ေနရာနဲ႔ပံုစံ ႏွစ္မ်ိဳးရွိပါတယ္။
* ၁)ပံုစံခ်ရန္
html code မွာ ေအာက္ပါအတိုင္း ထည့္ရန္ေနရာရွာပါခင္ဗ်။
#header-wrapper {
width:985px;
height: 210px;
margin:0 0 0px;
ခ်ံဳ႕လိုက္ပါတယ္
color: #ffffff;
text-align: right;
}
#header img {
margin-left: auto;
margin-right: auto;
}
ဤေနရာတြင္ထည့္ရန္
/* Outer-Wrapper----------------------------------------------- */
#outer-wrapper {
width: 980px;
margin:0 auto;
padding:0px;
text-align:left;
font: normal normal 100% Zawgyi-one,Georgia, Serif;
ထည့္ရမယ့္ေနရာကို ရွာျပီးျပီဆိုရင္ ေအာက္ပါအစိမ္းေရာင္ ကုဒ္မ်ားအားေရြးထည့္ပါခင္ဗ်ာ။
/*top menu*/
#foxmenucontainer{
height:30px;
background:#000000 url(http://img52.imageshack.us/img52/7321/titv.png) no-repeat;
display:block;
padding:0px 0 0px 0px;border-top:1px solid #162400;border-bottom:1px solid #162400;
font: 13px "Century gothic",verdana, Arial, Zawgyi-One,sans-serif;
font-weight:normal;
}
ဒီအေပၚကအပိုဒ္မွာ 30px အရ အနိမ့္အျမင့္ညွိျပီး၊ background ကို အေရာင္ခ်ည္းသက္သက္ လုပ္လိုပါက backgroung: #000000; ဆိုျပီး အနက္ေရာင္ခင္းလိုက္ႏိုင္ပါတယ္။ အေရာင္ကုဒ္မ်ားအတြက္ အနက္ 000000၊ အျဖဴ ffffff နဲ႔ အျခားအေရာင္မ်ားကို cbox.ws က edit style မွာ စိတ္ၾကိဳက္ ရွာႏိုင္ပါတယ္ခင္ဗ်။ http://img52.imageshack.us/img52/7321/titv.png
လင့္ေနရာမွာေတာ့ စိတ္ၾကိဳက္ ပံုတင္ႏိုင္ပါတယ္။ ကြၽန္ေတာ္ကေတာ့ window theme ေတြကို print Screen ရိုက္ျပီး paint မွာ pixel ခ်ိန္ျပီး http://imageshack.us မွာ တင္ျပီး လင့္ယူပါတယ္ခင္ဗ်။ border အတြက္လည္း border-bottom:1px solid #162400; ဆိုရာမွာ ထက္ေအာက္ဘယ္ညာအတြက္ border-top: border-left: border-right: စသည္ျဖင့္ျပင္ႏိုင္ျပီး တစ္ပတ္လံုးအတြက္ border: အထူအက်ဲ px တန္ဖိုးျပင္ျပီး solid သုိ႔မဟုတ္ dotted ေျပာင္းႏိုင္ျပီး # ေနာက္က အေရာင္ပါ စိတ္ၾကိဳက္ေျပာင္းႏိုင္ပါတယ္ခင္ဗ်ာ။
#menu ,#menu ul { margin: 0px 5px; padding: 0px; list-style: none; height:39px; } #menu a { color: #38B63C; display: block; font-weight: bold; padding: 4px 10px 6px 10px; }
ဒီအေပၚက color: #38B63C; ကေတာ့ လက္ရွိျမင္ေနရတဲ့ ေခါင္းစဥ္စိမ္းေတြ ျဖစ္ပါတယ္ခင္ဗ်။ bold မလုပ္ခ်င္က normal ေပးထားႏိုင္ပါတယ္ခင္ဗ်။ padding: 4px 10px 6px 10px; အရ စာလံုးေလးေတြကို ကြၽန္ေတာ္တို႔ လုပ္ထားတဲ့ ဧရိယာအရ ထက္ေအာက္ ဘယ္ညာ ဘယ္ေလာက္ခြာဦးမယ္ဆိုတာကိုလည္း ညွိယူလို႔ရပါတယ္ခင္ဗ်။
#menu a:hover { background:#000000 url(http://img19.imageshack.us/img19/8690/2222ec.png) repeat-x; color: #ffffff; display: block; text-decoration: none; }
hower ဆိုတဲ့အေပၚပိုဒ္ကေတာ့ ကလစ္ခ်စဥ္မွာ ျမင္ရတာကို ျပင္တာျဖစ္ပါတယ္။ ကလစ္ခ်စဥ္မွာ အသည္းပံုေလးေတြ အတန္းလိုက္ေပၚခ်င္ရင္ အသည္းပံုေသးေလး တင္ျပီး repeat-x ေပါ့ဗ်ာ။ ဒီမွာေတာ့ အေပၚေအာက္အျဖဴေလး ကြၽန္ေတာ္လုပ္ျပီး အတန္းလိုက္ထားပါတယ္။ http://img19.imageshack.us/img19/8690/2222ec.pngကြၽန္ေတာ္ကေတာ့ Cursor ခ်စဥ္မွာ စာလံုးကို အျဖဴေရာင္ ေပၚခိုင္းထားလို႔ color: #ffffff; ျဖစ္ေနတာပါခင္ဗ်။
#menu li { float: left; margin: 0px 0 0px 0; padding: 0px; }
#menu li li { float: left; margin: px 0px 0px 5px; padding: 0px; width: 130px; }
#menu li li a, #menu li li a:link, #menu li li a:visited { background:url(http://img62.imageshack.us/img62/6821/subtit.png) ; width: 227px; float: none; margin: 0px; padding: 4px 10px 5px 10px; color:#38B63C; }
ဒီအေပၚက ပံုျဖစ္တဲ့ http://img62.imageshack.us/img62/6821/subtit.png ကို ဖြင့္ၾကည့္ျပီး သူ႔ေနရာမွာ အျခားပံုမ်ားနဲ႔ အစားသြင္းျပီး ေအာက္ကို ဆင္းက်လာမယ့္ စာတန္းေနာက္ခံကို ျပင္ႏိုင္ပါတယ္ခင္ဗ်။ စာတန္းအေရာင္ေရာ အက်ယ္ width ကိုပါ ျပင္ႏိုင္ပါျပီခင္ဗ်။
#menu li li a:hover, #menu li li a:active { background: #000000 url(http://img189.imageshack.us/img189/774/subtit2.png); width: 227px; float: none; margin: 0px; padding: 4px 10px 5px 10px; color:#ffffff; }
အေပၚပိုဒ္မွာကေတာ့ အသစ္ေပၚလာတဲ့ ပိုစ့္ေလးေတြေပၚကို Cursor ခ်စဥ္မွာ ျမင္ရမယ့္ စာလံုးအေရာင္နဲ႔ ေနာက္ခံ အေရာင္(ပံု) တို႔ကို ျပင္ႏိုင္ဖို႔ ျဖစ္ပါတယ္ခင္ဗ်ာ။ http://img189.imageshack.us/img189/774/subtit2.png
#menu li ul { position: absolute; width: 10em; left: -999em; z-index:1; } #menu li:hover ul { left: auto; display: block; } #menu li:hover ul, #menu li.sfhover ul { left: auto; }
ဤတြင္ ကြၽန္ေတာ္တို႔ရဲ႕ ေခါင္းစဥ္ပံုစံခ်လို႔ ျပီးပါျပီခင္ဗ်။
* ၂) ေခါင္းစဥ္စီရန္
html code မွာ ေအာက္ပါအတိုင္း ထည့္ရန္ေနရာရွာပါခင္ဗ်။
<div id='header-wrapper'>
<b:section class='header' id='header' maxwidgets='4' showaddelement='yes'>
<b:widget id='Header1' locked='true' title='နကၡတ္ေဗဒင္မွတ္စုမ်ား (Header)' type='Header'/>
</b:section>
<ul id='menu'>
</ul>
</div>
ဤေနရာတြင္ထည့္ရန္
<div id='content-wrapper'>
<div id='crosscol-wrapper' style='text-align:center'>
<b:section class='crosscol' id='crosscol' showaddelement='no'/>
</div>
<div id='main-wrapper'>
ထည့္ရမယ့္ ပံုစံကေတာ့ ေအာက္ကျပထားတဲ့ အနီေရာင္ေတြျဖစ္ပါတယ္ခင္ဗ်ာ။
<!-- Foxmenucontainer -->
<div id='foxmenucontainer'>
<div id='menu'>
<ul>
<ul class='children'>
<li><a href='ပိုစ့္(၁)၏လင့္' title='Cursorတင္စဥ္ ေပၚလာမည့္စာသား'>ပိုစ့္(၁)ေခါင္းစဥ္</a></li>
<li><a href='ပိုစ့္(၂)၏လင့္' title='Cursorတင္စဥ္ ေပၚလာမည့္စာသား'>ပိုစ့္(၂)ေခါင္းစဥ္</a></li>
<li><a href='ပိုစ့္(၃)၏လင့္' title='Cursorတင္စဥ္ ေပၚလာမည့္စာသား'>ပိုစ့္(၃)ေခါင္းစဥ္</a></li></ul></li>
<li><a href='#' title='Cursorတင္စဥ္ ေပၚလာမည့္စာသား'>ေခါင္းစဥ္(၂)</a>
<ul class='children'>
<li><a href='ပိုစ့္(၄)၏လင့္' title='Cursorတင္စဥ္ ေပၚလာမည့္စာသား'>ပိုစ့္(၄)ေခါင္းစဥ္</a></li>
<li><a href='ပိုစ့္(၅)၏လင့္' title='Cursorတင္စဥ္ ေပၚလာမည့္စာသား'>ပိုစ့္(၅)ေခါင္းစဥ္</a></li>
<li><a href='ပိုစ့္(၆)၏လင့္' title='Cursorတင္စဥ္ ေပၚလာမည့္စာသား'>ပိုစ့္(၆)ေခါင္းစဥ္</a></li></ul></li>
</ul>
</div>
</div>
<!-- /Foxmenucontainer -->
ဤေနရာမွာ ေခါင္းစဥ္ အသစ္တိုးလိုပါက
<li><a href='#' title='Cursorတင္စဥ္ ေပၚလာမည့္စာသား'>ေခါင္းစဥ္(၃)</a>
<ul class='children'>
<li><a href='ပိုစ့္(၇)၏လင့္' title='Cursorတင္စဥ္ ေပၚလာမည့္စာသား'>ပိုစ့္(၇)ေခါင္းစဥ္</a></li>
<li><a href='ပိုစ့္(၈)၏လင့္' title='Cursorတင္စဥ္ ေပၚလာမည့္စာသား'>ပိုစ့္(၈)ေခါင္းစဥ္</a></li>
<li><a href='ပိုစ့္(၉)၏လင့္' title='Cursorတင္စဥ္ ေပၚလာမည့္စာသား'>ပိုစ့္(၉)ေခါင္းစဥ္</a></li>
<li><a href='ပိုစ့္(၁၀)၏လင့္' title='Cursorတင္စဥ္ ေပၚလာမည့္စာသား'>ပိုစ့္(၁၀)ေခါင္းစဥ္</a></li>
<li><a href='ပိုစ့္(၁၁)၏လင့္' title='Cursorတင္စဥ္ ေပၚလာမည့္စာသား'>ပိုစ့္(၁၁)ေခါင္းစဥ္</a></li>
<li><a href='ပိုစ့္(၁၂)၏လင့္' title='Cursorတင္စဥ္ ေပၚလာမည့္စာသား'>ပိုစ့္(၁၂)ေခါင္းစဥ္</a></li></ul></li>
စသည္ျဖင့္တိုးႏိုင္ပါတယ္။ ပို႔စ္(၁၀)(၁၁) နဲ႔ (၁၂)တိုးပံုကို သတိျပဳ၍ ထပ္မံတိုးခ်ဲ႕လိုက္ႏိုင္ေၾကာင္းပါခင္ဗ်ာ။
ပံုစံနမူနာကေတာ့
<li><a href='http://kopakhan.myanmarbloggers.info/2010/02/surya-siddhanta.html' title='ဇာတာဆိုတာေကာင္းကင္ေျမပံုတစ္ခုမွ်သာျဖစ္ပါေၾကာင္း။'>သူရိယသႏၵိတၳက်မ္း</a></li>
ျဖစ္ပါတယ္ခင္ဗ်ာ။ ကြၽန္ေတာ္နမူနာထည့္ပံုကို Contro+u ႏွိပ္၍ ေလ့လာႏိုင္ေၾကာင္းပါခင္ဗ်။
Subscribe to:
Posts (Atom)
