HTML Element မ်ား
HTML document ေတြကုိ HTML element ေတြဆုိျပီ ေခၚေဝၚသတ္မွတ္ၾကပါတယ္။
HTML Element မ်ား
HTML element ဆုိတာက start tag နဲ႔ end tag ၾကားက အရာေတြအကုန္လုံးျဖစ္ပါတယ္။
| Start tag * | Element တြင္ပါဝင္ေသာအရာမ်ား | End tag * |
|---|---|---|
| <p> | ဒါက စာပုိဒ္တစ္ခုျဖစ္ပါတယ္။ | </p> |
| <a href="default.htm"> | လင့္ခ္တစ္ခုျဖစ္ပါတယ္။ | </a> |
| <br /> | ေရျပင္ညီ မ်ဥ္းတစ္ေၾကာင္းျဖစ္ပါတယ္။ | ၎တြင္ End Tag မရွိပါ။ |
* Start tag ကုိတစ္ခါတစ္ေလမွာ opening tag လုိ႔လဲေခၚေလ့ရွိပါတယ္။ End tag ကုိေတာ့ closing tag လုိ႔ေခၚပါတယ္။
HTML Element Syntax
- HTML element တစ္ခုကုိ start tag / opening tag နဲ႔အစျပဳပါတယ္။ end tag / closing tag နဲ႔အဆုံးသတ္ပါတယ္။
- element မွာပါဝင္တဲ့ အရာ content ေတြကေတာ့ start နဲ႔ end tag ၾကားကအရာေတြျဖစ္ပါတယ္။
- တစ္ခ်ိဳ႕တဲ့ HTML element ေတြမွာဗလာ empty content ပဲပါပါတယ္။
- Empty element ေတြကုိ start tag နဲ႔ပိတ္ထားပါတယ္။
- HTML element အမ်ားစုမွာ Attribute ေတြ ပါႏုိင္ပါတယ္။
မွတ္ခ်က္ — Attribute ေတြအေၾကာင္းကုိ ေနာက္လာမယ့္အခန္းမွာ သင္ရပါမယ္။HTML Element အတြဲမ်ား (Nested)
HTML element ေတြဟာ အတြဲလုိက္ ျဖစ္ႏုိင္ပါတယ္။ (အျခား HTML element ေတြလည္းပါႏုိင္ပါတယ္)။
HTML document ေတြမွာ HTML element အတြဲေတြပါရွိပါတယ္။
HTML document ေတြမွာ HTML element အတြဲေတြပါရွိပါတယ္။
HTML Document ဥပမာ
<! DOCTYPE html>
<html>
<body>
<p>ဒါက ပထမ စာပုိဒ္ျဖစ္ပါတယ္။</p>
</body>
</html>
<html>
<body>
<p>ဒါက ပထမ စာပုိဒ္ျဖစ္ပါတယ္။</p>
</body>
</html>
အေပၚက ဥပမာကုိ ၾကည့္ရင္ HTML element ၃ ခုပါတာကုိ ေတြ႔ရမွာျဖစ္ပါတယ္။
HTML ဥပမာရွင္းလင္းခ်က္
<p> element
<p>ဒါက ပထမစာပုိဒ္ျဖစ္ပါတယ္။</p>
<p> element က HTML document မွာရွိတဲ့ စာပုိဒ္ကုိ သတ္မွတ္ပါတယ္။
ဒီ element မွာ start tag <p> တစ္ခုနဲ႔ end tag </p> တစ္ခုပါပါတယ္။
element မွာပါဝင္တဲ့ အရာ — ဒါကပထမစာပုိဒ္ျဖစ္ပါတယ္။
<body> element
ဒီ element မွာ start tag <p> တစ္ခုနဲ႔ end tag </p> တစ္ခုပါပါတယ္။
element မွာပါဝင္တဲ့ အရာ — ဒါကပထမစာပုိဒ္ျဖစ္ပါတယ္။
<body> element
<body><p>ဒါက ပထမစာပုိဒ္ျဖစ္ပါတယ္။</p>
</body>
<body> element က HTML document ရဲ့ ကုိယ္ထည္ျဖစ္တဲ့ Body ကုိသတ္မွတ္ပါတယ္။
element မွ start tag <body> တစ္ခုနဲ႔ end tag </body> တစ္ခုပါပါတယ္။
ဒီ element မွာ အျခား HTML element တစ္ခုပါပါတယ္။ (<p> element တစ္ခုပါတာကို ဆုိလုိပါတယ္)။
<html> element
element မွ start tag <body> တစ္ခုနဲ႔ end tag </body> တစ္ခုပါပါတယ္။
ဒီ element မွာ အျခား HTML element တစ္ခုပါပါတယ္။ (<p> element တစ္ခုပါတာကို ဆုိလုိပါတယ္)။
<html> element
<html>
<body>
<p>ဒါက ပထမစာပုိဒ္ျဖစ္ပါတယ္။</p>
</body>
</html>
<body>
<p>ဒါက ပထမစာပုိဒ္ျဖစ္ပါတယ္။</p>
</body>
</html>
<html> element က HTML document တစ္ခုလုံးကုိ သတ္မွတ္ပါတယ္။
element မွ start tag <html> တစ္ခုနဲ႔ end tag </html> တစ္ခုပါပါတယ္။
ဒီ element မွာ အျခား HTML element တစ္ခုပါပါတယ္။ (<body> element တစ္ခုပါတာကို ဆုိလုိပါတယ္)။
element မွ start tag <html> တစ္ခုနဲ႔ end tag </html> တစ္ခုပါပါတယ္။
ဒီ element မွာ အျခား HTML element တစ္ခုပါပါတယ္။ (<body> element တစ္ခုပါတာကို ဆုိလုိပါတယ္)။
End Tag ကုိမေမ့ပါနဲ႔
တစ္ခ်ိဳ႕တဲ့ HTML element ေတြဟာ သင့္အေနန႔ဲ end tag ထည့္ဖုိ႔ေမ့ခဲ့ရင္ေတာင္ အမွား ျပမွာမဟုတ္ပါဘူး။ ၾကည့္လုိက္ရင္အဆင္ေျပေနမွာပါ။
<p>ဒါက စာပုိဒ္တစ္ခုျဖစ္ပါတယ္။
<p>ဒါက စာပုိဒ္တစ္ခုျဖစ္ပါတယ္။
<p>ဒါက စာပုိဒ္တစ္ခုျဖစ္ပါတယ္။
အေပၚမွာျပထားတဲ့ ဥပမာကုိ browser (ဘေရာက္ဆာ) အမ်ားစုက အမွားမျပပဲလက္ခံပါတယ္။ closing tag ကဒီေနရာမွာ အေရးမၾကီးလုိ႔ပါ။
ဒါေပမယ့္ ဒီလုိေတာ့အျမဲမလုပ္သင့္ပါဘူး။ HTML element အမ်ားစု end tag ေမ့ခဲ့ရင္ေတာ့ မေမွ်ာ္လင့္ထားတဲ့ အမွားေတြျဖစ္လာေစႏုိင္ပါတယ္။
ဒါေပမယ့္ ဒီလုိေတာ့အျမဲမလုပ္သင့္ပါဘူး။ HTML element အမ်ားစု end tag ေမ့ခဲ့ရင္ေတာ့ မေမွ်ာ္လင့္ထားတဲ့ အမွားေတြျဖစ္လာေစႏုိင္ပါတယ္။
HTML Element အလြတ္မ်ား (Empty)
HTML element ေတြရဲ့အထဲမွာ ဘာမွမပါရင္ empty element ေတြလုိ႔ေခၚပါတယ္။
<br> ဆုိတာက Empty element တစ္ခုျဖစ္ျပီး closing tag မပါပါဘူး။ (<br> tag ကေအာက္တစ္ေၾကာင္းဆင္းဖုိ႔ line break အျဖစ္အသုံးျပဳၾကတာပါ)။
မွတ္ခ်က္ — Closing Tag မပါဘူးဆုိတာ အပိတ္မပါတာနဲ႔ မတူပါဘူး။ </br> ဆိုတာမ်ိဳးမရွိတာကုိ ေျပာတာပါ။ ဒါေပမယ့္ အဲသလုိမပါတဲ့အတြက္ သူ႔မွာ ထူးျခားခ်က္လည္း ရွိပါတယ္။ (/) မ်ဥ္းေစာင္းတစ္ခုကုိ ေနာက္မွထည့္ေပးရပါတယ္။ XHTML မွာ element အားလုံးမွာ အပိတ္ပါရပါမယ္။ start tag မွာ အခုလုိပုံစံမ်ိဳး <br /> မ်ဥ္းေစာင္းေလးထည့္လုိက္တာဟာ XHTML နဲ႔ XML အတြက္ လုပ္ထုံးလုပ္နည္းတစ္ခုျဖစ္ပါတယ္။ End Tag ေတာ့မရွိပါဘူး။
<br> ဆုိတာက Empty element တစ္ခုျဖစ္ျပီး closing tag မပါပါဘူး။ (<br> tag ကေအာက္တစ္ေၾကာင္းဆင္းဖုိ႔ line break အျဖစ္အသုံးျပဳၾကတာပါ)။
မွတ္ခ်က္ — Closing Tag မပါဘူးဆုိတာ အပိတ္မပါတာနဲ႔ မတူပါဘူး။ </br> ဆိုတာမ်ိဳးမရွိတာကုိ ေျပာတာပါ။ ဒါေပမယ့္ အဲသလုိမပါတဲ့အတြက္ သူ႔မွာ ထူးျခားခ်က္လည္း ရွိပါတယ္။ (/) မ်ဥ္းေစာင္းတစ္ခုကုိ ေနာက္မွထည့္ေပးရပါတယ္။ XHTML မွာ element အားလုံးမွာ အပိတ္ပါရပါမယ္။ start tag မွာ အခုလုိပုံစံမ်ိဳး <br /> မ်ဥ္းေစာင္းေလးထည့္လုိက္တာဟာ XHTML နဲ႔ XML အတြက္ လုပ္ထုံးလုပ္နည္းတစ္ခုျဖစ္ပါတယ္။ End Tag ေတာ့မရွိပါဘူး။
HTML မွာ အေသးစာလုံးေတြကုိသာသုံးပါ။
HTML tag ေတြဟာ စာလုံးအၾကီးအေသး လြဲလုိ႔သိပ္ျပႆနာမရွိတဲ့
အရာေတြျဖစ္ပါတယ္။ Case Sensitive ေတြမဟုတ္ပါဘူး — <P> က <p>
နဲ႔အတူတူပါပဲ။ ဝဘ္ဆိုဒ္ အမ်ားအျပားက စာလုံးအၾကီးနဲ႔ uppercase HTML tag
ေတြကုိသုံးၾကပါတယ္။
ဒီသင္ခန္းစာေတြမွာေတာ့ စာလုံးအေသးန႔ဲပဲသင္ေပးမွာျဖစ္ပါတယ္။ World Wide Web Consortium (W3C) က HTML 4 မွာ စာလုံးအေသးကုိသုံးဖုိ႔ တိုက္တြန္းထားျပီး XHTML အတြက္ကေတာ့ စာလုံးအေသးပဲလက္ခံလုိ႔ျဖစ္ပါတယ္။
ဒီသင္ခန္းစာေတြမွာေတာ့ စာလုံးအေသးန႔ဲပဲသင္ေပးမွာျဖစ္ပါတယ္။ World Wide Web Consortium (W3C) က HTML 4 မွာ စာလုံးအေသးကုိသုံးဖုိ႔ တိုက္တြန္းထားျပီး XHTML အတြက္ကေတာ့ စာလုံးအေသးပဲလက္ခံလုိ႔ျဖစ္ပါတယ္။
http://www.soemoeaung.com
ခုလိုအားေပးတဲ့အတြက္ အထူးေက်းဇဴးတင္ပါေၾကာင္း ေျပာၾကားပါရေစ..ဘေလာ့ခရီးသည္မွ နည္းပညာမ်ားအား မည္သူမဆို လြတ္လပ္စြာ ကူးယူသုံးစြဲနိဳင္ပါတယ္.. ကြ်န္ေတာ္ ပိုင္ဆိုင္ေသာေနရာေလးမ်ားအား ဆက္လက္ လည္ပါတ္လိုပါက
***************************************
ဘေလာ့ခရီးသည္သို႕ { ဒီမွာ } သြားလိုက္ပါ
လယ္တီေျမသားသို႕{ ဒီမွာ } သြားလိုက္ပါ
စာေပနန္းေတာ္သို႕{ ဒီမွာ } သြားလိုက္ပါ
0 comments:
Post a Comment