လိုင္းေျပး

div class="widget-content"> အလည္ေရာက္ရွိလာတဲ့ သူငယ္ခ်င္းမ်ား ေပ်ာ္ရႊင္ခ်မ္းေျမ့ပါေစ

စာမ်က္ႏွာမ်ား

Sunday, March 8, 2015

(၁)    <!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