Thursday, July 2, 2015

lession1.html

lession1.html

BASIC HTML

 htmlကိုအေျခခံစေရးမယ္ဆိုရင္ေတာ့ပထမဆံုး

  
    <html>
   <head> </head>
   <body> </body>
    </html>
  

 
    htmlနဲ႔ေရးတာျဖစ္တဲ့အတြက္<html>နဲ႕စပါတယ္
    htmlမွာ အဖြင့္tagကို<html>နဲ႕ေရးျပီးအပိတ္ကို
    </html>မ်ဥ္းေစာင္းခံျပီးေရးပါတယ္။ကိုယ္ေရးလို
    တဲ့အေၾကာင္းအရာကို အဖြင့္tagနဲ႔အပိတ္tag
    ၾကားမွာေရးရပါတယ္။ html tagေတကေတာ့
    ၁.<html> </html>
    ၂.<head> </head>
    ၃.<title> <title>
     ၄.<body> </body>
     ၅.<h1>to ...<h6>
      ၆.<p>
      ၇.<pre>
     ၈.<div>
       ၉.<img>
       ၁၀.<a>
      အစရွိတာေတြပဲျဖစ္ပါတယ္ ေနာက္ထပ္မ်ားစြာ
      က်န္ပါေသးတယ္ က်န္တဲ့ဟာကိုေတာ့ေနာက္
      သင္ခန္းစာမွာဆက္ၾကည့္ရေအာင္ OK?
   

သင္ခန္းစာ(၂)

  ပထမဆံုးcodeတစ္ခုစေရးၾကည့္ရေအာင္

  

    <html>
   <head>
     <title>ဒါကေခါင္းစဥ္ပါ browserရဲ႕address bar
    မွာေပၚမယ့္ေခါင္းစဥ္ပါ
     </title>
   </head>
   <body>
     <h1 align="center">ငေၾကာင္စာမ်က္ႏွာ</h1>
     <p>က်မႏွင္းဆီပါေမာင္:-P ေသခ်ာမကိုင္ရင္ဆူး
    တတ္ပါတယ္ေမာင္ ခိခိ
     </p>
   </body>
    </html>

  

  အေပၚကကုဒ္ကိုcopyကူးျပီး
  

  
  အဲ့ဒီcodeကိုရွင္းပါမယ္ 
  <head>ဆိုတာကဒီစာမ်က္နွာရဲ႕ေခါင္းပိုင္းပါ
  <title>ကbrowserရဲ႕search barမွာေပၚလာ
    မယ့္နာမည္ပါ <body>ကဒီစာမ်က္နွာရဲ႕ကိုယ္
    ပိုင္းပါ <h1>ကေတာ့ ေခါင္းစဥ္တပ္ရာမွာသံုးတာ
   ပါ h1ကေနh6ထိရွိပါတယ္ h1ကေခါင္းစဥ္အရြယ္
   အစားအၾကီးဆံုးျဖစ္ျပီး h6ကေတာ့အငယ္ဆံုးျဖစ္
   ပါတယ္ <p>ကေတာ့စာပိုဒ္ခြဲေတြေပါ့ဗ်ာ
   paragraphရဲ႕အတိုေကာက္ အဲ့ဒီထဲကalignဆို
   တာက altributeလို႔ေခၚပါတယ္ သတ္မွတ္ခ်က္
   ေပါ့ေနာ္ သူ႔ေနာက္ကcenterဆိုတာကvalueပါ
   alignဆိုတာေနရာသတ္မွတ္ခ်က္ျဖစ္ျပီး သူ႔ရဲ႕
   တန္ဖိုူးကိုcenterထားလိုက္ေတာ့ စာေတက
   စာမ်က္နွာရဲ႕အလည္တည့္တည့္မွာေပၚတာေပါ့
   leftဆိုဘယ္ rightဆိုညာေပါ့
   ကဲအေပၚကcodeကိုစမ္းၾကည့္ပါ h1ကေနh6ထိ
   ေျပာင္းၾကည့္ left, right, centerေျပာင္းၾကည့္ပါ

   ေနာက္သင္ခန္းစာေတြကိုေနာက္စာမ်က္နွာမွာဆက္ဖတ္ျကရေအာင္ bye bye...:-)
 

သင္ ခန္းစာ(၃)

  ကဲဒီတစ္ခါေျပာျပမွာကေတာ့ Altribute
  ေတြအေၾကာင္းပါခမ်ာ Altributeဆိုတာ
  ကေတာ့က်ေနာ္တို႔ေရးလိုက္တဲ႔စာသား
  ေတြကိုပိုမိုျပီးလွပေအာင္ဖန္းတီးေပးတဲ႔
  အမိန္႔ေတြပဲျဖစ္ပါတယ္ ကဲ စလိုက္ရေအာင္

  ၁.align

  alignဆိုတာကေတာ့စာသားကိုဘယ္ညာ
  အလယ္မွာေနရာခ်ေပးတဲ႔အရာပါ

  ၂.style

  styleဆိုတာကေတာ့စာသားဒီဇိုင္းေတြ
  လုပ္တာပါcssလိုပါပဲ

  ၃.font-size

  စာသားအရြယ္အစားပါ သူ႕valueကို
  pixels(px)နဲ႔တြက္ခ်က္ပါတယ္

  ၄.font-color

  စာသားအေရာင္ပါ သူ႔valueကေတာ့နွစ္
  မ်ိဳးသတ္မွတ္ပါတယ္ greenဆိုျပီး
  colorအေရာင္နာမည္ကိုတိုက္ရိုက္ေခၚသံုးနိုင္သလို codeနဲ႔လည္းေခၚလို႔ရပါ
  တယ္ codeနဲ႔ေခၚမယ္ဆိုရင္ေတာ့ အေရွ႕မွာ#ခံရပါမယ္ ဥပမာ
  font-color="#129921"ေပါ့
  အဲ႔ဒါနည္းနည္းရွင္းမယ္ ေရွ႕ႏွစ္လံုးက
  အနီေရာင္ပါ အလယ္ကအစိမ္းပါ ေနာက္
  နွစ္လံုးကအျပာပါ အေပၚကcodeဆို
  အစိမ္းေရာင္ပိုသန္းပါလိမ့္မယ္ အဲ့နည္း
  နဲ႔ၾကိဳက္တဲ႔အေရာင္ကိုစပ္လို႔ရပါတယ္

  ၅.background-color

  ေနာက္ခံအေရာင္ပါ

  ကဲလက္ေတြ႕လုပ္လိုက္ၾကရေအာင္

    <html>
   <head>
     <title>google</title>
   </head>
   <body style="background-color:violet;">
     <h1 align="left">
    ငိုးမတား
     </h1>
     <h2 align="center">
    မတာမ
     </h2>
     <h3 align="right">
    ခ်ဥ္ေပါင္ရိုးမ
     </h3>
     <p style="font-color:yellow;font-size:20px;">
    အဲ့ဒီေတာ့သူကဘာျပန္ေျပာလဲ သြား
    ေမးၾကည့္ေလ
     </p>
     <p style="font-color:#129901;font-size:10px;">
    အဲ့ဒီေတာ့ငါကကျပရမွာလား
     </p>
   </body>
    </html>
  
  ကဲအေပၚကcodeကိုcopyကူးျပီးေအာက္
  မွာစမ္းၾကည့္ပါဦးဗ်ာ



  

No comments: