H .. T .. M .. L

 

ဒီပို႕စ္ဟာ ရြာထဲက သိၿပီးသား ရြာသူားေတြအတြက္ ရည္ရြယ္ေရးသားျခင္း မဟုတ္ပါ ခင္ဗ်ာ။ မသိေသးသူေတြ၊ စိတ္ဝင္စားသူေတြအတြက္ ဗဟုသုတ ရေစျခင္းငွာ က်ေနာ္ သိထားသေလာက္ ျပန္ရွဲျခင္းသာ ျဖစ္ပါတယ္။ ကၽြန္ေတာ္ ေရးသားတဲ့ထဲမွာ အမွားေတြလည္း ပါေကာင္းပါႏိုင္ပါတယ္။ ထိုထုိေသာ အမွားမ်ားကို သိထားသူမ်ားက ေထာက္ျပေပးၾကပါလို႕ ေမတၱာရပ္ခံအပ္ပါတယ္ ခင္ဗ်ာ ….
အံစာတံုး

HTML (အိတ္ခ်္ထီအန္မ္အယ္လ္) မိတ္ဆက္

HTML ဆိုတာ Web Pages ေတြ ေရးတဲ့အခါမွာ အသုံးျပဳတဲ့ Hyper Text Markup Language ပဲ ျဖစ္ပါတယ္။ Programming Language ေတာ့ မဟုတ္ပါဘူး။ သူ႔ကို ေရးတဲ့အခါ angle bracket (ေထာင့္ကြင္း) ထဲမွာ ထည့္သြင္း ေရးသားရပါတယ္။ ဥပမာ – <html> ။ အဲဒီလို ပုံစံမ်ိဳးကို tag (တက္ဂ်္) လို႔ ေခၚပါတယ္။ HTML မွာ tag ေတြက အဖြင့္နဲ႔ အပိတ္ဆိုၿပီး စုံတြဲ လာတာ မ်ားပါတယ္။ အဖြင့္ tag မွာ ဒီအတိုင္း ေထာင့္ကြင္း ၂ ခုၾကား ေရးေပမယ့္ အပိတ္ tag မွာေတာ့ ( / ) ေလး ပါပါတယ္။ ဥပမာ – <html> <html> ။

HTML document တစ္ခုထဲမွာ HTML tag ေတြနဲ႔ ရိုးရိုး စာသားမ်ား ပါဝင္ နိုင္ပါတယ္။ ဒီ HTML document ရဲ့ အလုပ္ကလည္း Web page ေတြကို ျပသေပးဖို႔ပဲ ျဖစ္ပါတယ္။ HTML document ေတြကို Web Page လို႔လည္း ေခၚဆို ၾကပါေသးတယ္။ Firefox, IE, Chrome စတဲ့ Internet Browser ေတြရဲ့ အဓိက ရည္ရြယ္ခ်က္ကလည္း HTML document ေတြကို ဖတ္ဖို႔၊ ဖတ္ၿပီးရင္ အဲဒီ HTML document ေတြကို Web page အျဖစ္ ျပန္လည္ ျပေပးဖို႔ပဲ ျဖစ္ပါတယ္။

HTML စေရးၾကည့္ၾကရေအာင္

HTML ေရးဖို႕အတြက္ Notepad က အေကာင္းဆံုးပါပဲ။ Notepad ကို ဖြင့္ဖို႕အတြက္ Start ကေန သြားရွာလိုက္ပါ။ အလြယ္ဆံုး Notepad ကို ေခၚနည္းကေတာ့ – Keyboard ထဲက Windows Logo key နဲ႕ R ကို တြဲႏွိပ္ၿပီး အဲဒီ box ထဲမွာ notepad လို႕ ရိုက္ထည့္ၿပီး Enter ေခါက္လိုက္တာနဲ႕ Notepad ပြင့္လာပါလိမ့္မယ္။

HTML စေရးဖို႕အတြက္ ပထမဆံုး အဖြင့္ tag နဲ႕ စပါတယ္။ ဒီလိုေပါ့ <html> ။ ေရးသူအမ်ားစု ကေတာ့ အဖြင့္ tag နဲ႕ အပိတ္ tag ကို တစ္ခါတည္း တြဲေရးၾကတာ မ်ားပါတယ္။ ဘာလုိ႕လဲ ဆိုေတာ့ တစ္ခါတစ္ေလမွာ အပိတ္ tag ကို ေရးဖုိ႕ ေမ့ေနတတ္လို႕ပါပဲ။ ကဲဗ်ာ … စၾကည့္ရေအာင္။ Notepad ထဲမွာ အရင္ဆံုး ေအာက္ကလိုေလး ေရးလိုက္ပါ။

<html>
<body>
Hello World!
<body>
<html>

အဲလိုေလး ေရးၿပီးသြားရင္ ကိုယ္ Save ခ်င္တဲ့ေနရာမွာ Save လိုက္ပါ။ Save တဲ့အခါမွာ File name ရဲ႕ ေနာက္မွာ .html ခံၿပီးမွ Save ရပါတယ္။ ဥပမာ အားျဖင့္ man ဆိုတဲ့ နာမည္နဲ႕ Save မယ္ဆိုပါစို႕။ ဒါဆို man.html ဆိုၿပီး Save ရပါတယ္။ ကိုယ္ Save ထားတဲ့ ေနရာကို သြားၾကည့္လိုက္ရင္ HTML document ေလးကို ေတြ႕ရပါလိမ့္မယ္။ ကိုယ့္ ကြန္ပ်ဴတာမွာ default browser က Firefox ဆိုရင္ Firefox ပံုစံမ်ိဳးေလး ျဖစ္ေနပါလိမ့္မယ္။ အဲဒါေလးကို double click ႏွိပ္ၿပီး ဖြင့္ၾကည့္လိုက္ပါ။ Hello World! ဆိုၿပီး ေပၚေနတာကို ေတြ႕ရပါလိမ့္မယ္။

အထက္က ထဲမွာ html ဆိုတဲ့ tag ရယ္၊ body ဆိုတဲ့ tag ရယ္ ဆုိၿပီး tag ႏွစ္ခု ပါပါတယ္။ html ကေတာ့ main tag ႀကီးေပါ့။ body ဆိုတဲ့ tag ထဲမွာေတာ့ ခုလို ရုိးရုိးစာေတြ၊ လင့္ေတြ၊ ဇယားကြက္ေတြ စသည္ျဖင့္ ေနာက္ထပ္ tag အမ်ားႀကီး ထည့္သြင္း ေရးသားပါတယ္။ Hello World! ဆိုတဲ့ ေနရာမွာ ကိုယ္ႀကိဳက္တဲ့ စာသားကို ႀကိဳက္သေလာက္ ျပန္ျပင္ၿပီး ရိုက္ထည့္၊ ၿပီးရင္ save လိုက္ပါ။ HTML document ကို ျပန္ၿပီး run ၾကည့္ပါ။ ကိုယ္ရိုက္ထည့္ထားတဲ့ စာသားေတြ Web page ေပၚမွာ ေပၚေနတာကို ေတြ႕ရပါလိမ့္မယ္။

ဒီေနရာမွာ တစ္ခု ေျပာစရာ ရွိတာကေတာ့ ယူနီကုတ္၊ ေဇာ္ဂ်ီ စတဲ့ ျမန္မာစာေတြ ေရးမယ္ဆို Save တဲ့အခါ File name ရဲ႕ေအာက္ တစ္ကြက္ေက်ာ္မွာ ရွိတဲ့ Encoding ဆိုတဲ့ ေနရာမွာ UTF-8 ဆိုတာကို ေရြးၿပီးမွ Save ရပါတယ္။ ဒါမွသာ ျမန္မာစာေတြ ေပၚမွာ ျဖစ္ပါတယ္။ ေနာက္တစ္ခုက စာေတြ မ်ားသြားတဲ့အခါ ဘယ္လိုပဲ notepad ထဲမွာ Enter ေခါက္ၿပီး စာကို ေအာက္တစ္ေၾကာင္း ဆင္းဦးေတာ့၊ Web Page ေပၚမွာေတာ့ ဆင္းမွာ မဟုတ္ပါဘူး။ စာသားေတြ ဆင္းဖို႕ အတြက္ေတာ့ &lt;br&gt; ဆိုတဲ့ tag ေလးကို ထည့္ေရးေပးရပါတယ္။
နမူနာ အားျဖင့္ – ဟိုဟာ မလုပ္ပါနဲ႕ <br> ဒီဟာ မလုပ္ပါနဲ႕ <br> မင္း သတိထားပါ၊ ဘာညာသာရကာေပါ့။
ဒါဆိုရင္ – ဟိုဟာ မလုပ္ပါနဲ႕ က တစ္ေၾကာင္း၊ ဒီဟာ မလုပ္ပါနဲ႕ က တစ္ေၾကာင္း၊ မင္းသတိထားပါ၊ ဘာညာသာရကာေပါ့ ဆိုတာက တစ္ေၾကာင္း ျဖစ္သြားပါလိမ့္မယ္။

အျပည့္အစံုပံုစံ –

<html>
<body>
ဟိုဟာ မလုပ္ပါနဲ႕ <br>
ဒီဟာ မလုပ္ပါနဲ႕ <br>
မင္း သတိထားပါ၊ ဘာညာသာရကာေပါ့။
<body>
<html>

ဒီေန႕ေတာ့ ဒီေလာက္နဲ႕ပဲ ရပ္လိုက္ပါတယ္။ မရွင္းလင္းတာေတြ၊ အဆင္ မေျပတာေတြမ်ား ရွိရင္ comment ထဲမွာ ေမးျမန္းႏိုင္ပါတယ္ ခင္ဗ်ာ။ က်ေနာ္ သိသေလာက္ေတာ့ ျပန္လည္ ေျပာျပေပးသြားပါမည့္ အေၾကာင္း …………… ။

အိတ္ခ်္ … ထီ … အန္မ္ … အယ္လ္-၂

ေရးသားသူ – အံစာတံုး

About မဟာရာဇာ အံစာတံုး

has written 306 post in this Website..

အခ်ိဳ႕ေသာ အရာေတြဟာ "ေျပာင္" ၿပီးရင္ ျပန္ေကာင္းဖို႕ မလြယ္ဘူး။ အခ်ိဳ႕အရာေတြ က်ေတာ့ တစ္မ်ိဳး။ "ေျပာင္" ၿပီးရင္ ပိုပို ေကာင္းလာတတ္တဲ့ အမ်ိဳး။ ႏႈတ္ခမ္းေမြး ေျပာင္ေအာင္လို႕ ရိတ္တယ္။ ရိတ္ေလ .. သန္ေလပဲ။ ထိပ္ေျပာင္လို႕ ဆံပင္ သန္ေအာင္ လုပ္တယ္။ မလြယ္ျပန္ဘူး။ ဒီသေဘာ .. ဒီသေဘာ။