(၁) <!doctype html>
(၂) <html>
(၃) <head>
(၄) <link href="css/style.css"rel="stylesheet"type="text/css"/>
(၅) </head>
(၆) <body>
(၇) <header>
(၈) <section id="main_hdr">
(၉) <section id="lt">
(၁၀) <img src="image/logo1.png">
(၁၁) <h3>သင္ၾကားျခင္းျဖင့္လူမႈဘ၀ျမွင့္တင္ၾကပါစို႕သင္ၾကားျခင္းျဖင့္လူမႈဘ၀ျမွင့္တင္ၾကပါစို႔သင္ၾကားျခင္းျဖင့္လူမႈဘ၀ျမွင့္တင္ၾကပါစိ႔ု</h3>
(၁၂) <h1>LearnWebDesigner</h1>
(၁၃) <h2>Learner We are Service</h2>
(၁၅) </section><!--End of lt-->
(၁၆) <section id="rt">
(၁၇) <p>Contact info</P>
(၁၈) <p>Email,Call:+95925664710</p>
(၁၉) </section><!--end of rt-->
(၂၀) </section>
(၂၁) </header>
(၂၂)
(၂၃) <nav>
(၂၄) <ul>
(၂၅) <li><a href="index.html">Home</a></li>
(၂၆) <li><a href="download">Video</a></li>
(၂၇) <li><a href="#">Learn</a></li>
(၂၈) <li><a href="#">Blog</a></li>
(၂၉) <li><a href="#">FaceBookContact</a></li>
(၃၀) <li><a href="#">Mobileconoer</a></li>
(၃၁) </ul>
(၃၂) </nav>
(၃၃) </body>
(၃၄) </html>
အေပၚမ်ာျပထားတာကေတာ့ပုံထဲကWebpageရဲ႔ကုဒ္ေတြပါနံပါတ္အစဥ္လိုက္ရွင္းျပပါမယ္
ပိုရွင္းေအာင္ဒီလိုအပိုင္းလိုက္ခြဲလိုက္တာပါ
(၁) <!doctype html> ဒါကBrowser ကိုက်ေနာ္တို႔ေရးထားတဲ႔စာမ်က္ဟာhtmlစာမ်က္ႏွာတစ္ခုပါလို႔အသိေပးလိုက္တာပါ
(၂) <html> Webpageတစ္ခုရဲ႔ပင္မပရိုဂရမ္စတင္ေၾကာင္းေၾကျငာလိုက္ပါ႔ပီသူနဲ႔တြဲလွ်က္အပိတ္ Tag ေလးက</html>ဆိုတဲ႔နံပါတ္(၃၄)
ပါဒီတစ္တဲြအတြင္းမွာမွက်န္တဲ့အတြဲေတြထည့္ရပါတယ္ဆက္ၾကည့္သြားပါ
(၃) <head>သူကဘေရာက္ဆာကိုသီးျခားခိုင္းေစေရးေတြအသိေပးတဲ့ေနရာပါသူနဲ႔တြဲဖို႔</head>နံပါတ္(၅)ပါဒီတစ္တြဲၾကားမွာထည့္ရမွာေတြေနာက္မွျပသြားပါမယ္
(၄) ကိုခနခ်န္ခဲ့လိုက္ပါ Css ဖိုင္ကိုက်ေနာ္ခ်ိတ္ဆက္ထားတာပါေနာက္မွေျပာျပပါမယ္
(၆) သူကပင္မစာမ်က္ႏွာရဲ႕ကိုယ္ထည္ႀကီးပါနံပါတ္(၃၃)နဲ႔တြဲရပါမယ္က်ေနာ္ေရးဖြဲ႕လိုသမွ်ေတြကိုဒီအတြဲႏွစ္ခုၾကားမွာအကန္႔လိုက္ေရးဖြဲ႕ၾကရတာပါ။
အခုဆိုဒီလုိေလးျဖစ္ေနပါပီ
<!doctype html>
<html>
<head>
</head>
<body>***********************************
</body>
</html>
က်ေနာ္ၾကယ္ေလးေတြျပထားတဲ့ေနရာမွာHTML ကုဒ္ေတြထပ္တိုးၾကရပါတယ္ဘာေတြတိုးမလဲ ? စာပိုဒ္ေတ၊ပုံေတစာမ်က္ႏွာတစ္ခုရဲ႕ခ်ိတ္ဆက္မႈေတစသည္စသည္ေပါ့ဒီေနရာမွာေျပာလိုတာေလးက
HTMLဘာသာစကားရဲ႕စည္ကမ္းေလးေတြနဲ႔သိသင္တာေလးေတါေပါ့ <........>နဲ႔ </......>အတြင္းကေရးသမွ်ကိုWebBrowserေတြကသူတို႔ကိုခိုင္းေစတဲ့လမ္းညႊန္ေတြလို႔မွတ္ထားာ႕ပါတယ္
အဲ့ဒါေတါကို Tag လုိ႔ေခၚတာပါအဖြင့္အပိတ္တစ္စုံစီတဲြေရးရပါတယ္စာလုံးအႀကီးအေသးဘယ္လိုေရးေရးရပါတယ္သို႕ေသာ္စနစ္တက်ျဖစ္ဖို႔အေသးမ်ားသာေရးၾကပါတယ္ HTML Tagအျဖစ္သတ္မွတ္
ထားေသာ္ကုဒ္ေတြကိုေတာ့စာသားအျဖစ္တိုက္ရိုက္ထည့္ေဖၚျပခြင့္မျပဳပါဘူးအသုံးျပဳလိုလွ်င္ကိုယ္စားကိန္းေတြနဲ႔ေရးရပါတယ္ဒါဆိုအေျခခံေလးရပါပီက်န္တာေတြကိုေလ့လာရင္းမွတ္သားၾကပါမယ္
အခုက်ေနာ္အေပၚမွာျပလိုက္ကုဒ္ (၇)ခုကိုေရးပီး အမည္တခုေပးပီး .html ဆိုတဲ့ဖိုင္ေဖါမတ္နဲ႔သိမ္းလိုက္ပါအဲ့ဖိုင္ကိုကလစ္ႏွစ္ခ်က္ႏွိပ္ဖြင့္လိုက္မယ္ဆိုဘေရာက္ဆာတစ္ခုနဲ႔ပြင့္လာပါမယ္ဒါဆိုေအာင္
ျမင္စြာWebစာမ်က္ႏွာတခုရလိုက္ပါ႔ပီဘာမွေတာ့ျမင္ရမွာမဟုတ္ေသးပါဘူးဘာျဖစ္လို႔လည္းဆိုက်ေနာ္တို႔ေဘာ္ဒီထဲမွာဘာမွမထည့္ရေသးလို႔ပါ အခု Tagတစ္ခုတိုးၾကည့္ရေအာင္ <header>ဆိုတဲ့
ေခါင္းစီးပိုင္းကအစိမ္းေရာင္ေနာက္ခံေနရာေလးပါ <header> </header>ေပါ့ဒါဆိုေခါင္းစီးပိုင္းကေနရာေလးရေနပါပီေနာက္တခါထပ္တိုးမယ္ <h1>ဆိုတဲ့ေခါင္းစီးစာပိုဒ္တဂ္ေလးပါသူကအႀကီး
အေသးအမ်ိဳးစား (၇)မ်ိးရွိပါတယ္ <h1-2-3-4-5-6-7>ေပါ့တစ္ကအႀကီးဆုံးပါခြန္ႏွစ္ကအေသးဆုံးေပါ့အစားထိုးၾကည့္ပါသေဘာေပါက္ပါလိမ့္မယ္သူကလည္းအဖြင့္ပိတ္တစ္စုံပါပဲ
အခု
<!doctype html>
<html>
<head>
</head>
<body>
<header>
<h1> LeanerWebDesigner by LWD</h1>
</header>
</body>
</html>ဆိုပိးရေနပါပီဖြင့္လိုက္ရင္LeanerWebDesigner by LWD ဆိုတာေလးျမင္ရပါပီက်ေနာ့နမူနာစာမ်က္ႏွာမွာေတာ့အကန္႔လိုက္ခြဲထားခ်င္လို႕ Sectionခြဲတဲ့ တဂ္ေလးထည့္ထားပါတယ္ဒီနမူနာ
ေလးအတိုင္းဆက္သြားၾကည့္ပါမယ္<h1>အထက္မွာ <section id="lt">လို႔ထည့္လိုက္ပါတယ္ဒါကဘာလုပ္တာလဲဆိုေခါင္းစီးအစိမ္းထဲမွာကိုယ္ျပလိုတဲ့စာေလးေတြအတြက္ကန္႔လိုက္တာပါ
sectionဆိုတာကအကန္႔Tag ေပါ့IDဆိုတာကသီးသန္႔သတ္မွတ္ဖို႔ေပါ့Section ရဲ႔ Attributeက အိုင္ဒီအျဖစ္မွတ္ထားေသာ"LT"ဆိုတဲ့စာသာေလးပါလို႔သတ္မွတ္လုိက္တာပါ "LT"ဆိုတဲ့ " "ႏွစ္ခုၾကား
မွာဘာမဆိုထည့္ႏိုင္ပါတယ္က်ေနာ္က Left ဘယ္ဘက္ဆိုတာကိုအတိုေရးလိုက္တာပါနားလည္မလားပဲ <h1>ထဲကေရးတဲ့စာကိုဘယ္ဘက္မွာေပၚဖို႔ပါအဲ့ဒီလိုသိးသန္႔စီခြဲလိုတဲ့အခါအိုင္ဒိသတ္မ်တ္ေပး
ရပါတယ္အခုဆို
<!doctype html>
<html>
<head>
</head>
<body>
<header>
<section id="lt">
<h3>သင္ၾကားျခင္းျဖင့္လူမႈဘ၀ျမွင့္တင္ၾကပါစို႕သင္ၾကားျခင္းျဖင့္လူမႈဘ၀ျမွင့္တင္ၾကပါစို႔သင္ၾကားျခင္းျဖင့္လူမႈဘ၀ျမွင့္တင္ၾကပါစိ႔ု</h3>
<h1>LearnWebDesigner</h1>
<h2>Learner We are Service</h2>
</section><!--End of lt-->
</header>
</body>
</html>
ဆုိပီးရေနပါမယ္ Runၾကည့္လိုက္ပါဦးေနာက္ေန႔မွLink နဲ႔ CssStyle ေလးခ်ိတ္ဆက္ပီးထပ္တိုးသါားၾကပါမယ္
ေက်းဇူးတင္ပါတယ္
သင္ခန္းစာကိုေအာက္မွာယူပါDownload_
No comments:
Post a Comment