2015/08/03

abbr,address,area tag



  <abbr> <address> <area>

Savings

  <abbr>  
<abbr> ဆိုတာကေတာ့ စာတစ္ပုဒ္ကို ခ်ံဳ႕ ဖို့အတြက္ပါ ခ်ံဳ႕တယ္ဆိုတာက စာအၿပည့္စံု မေဖာ္ၿပဘဲ စကားစုေလးတင္ေဖာ္ၿပၿပီး အဲဒီအေပၚ ေမာက္ေလးတင္လိုက္မ အေၿပည့္စံုေဖာ္ၿပေပးတယ္ ဆိုတာကိုေၿပာတာပါ အသံုးၿပဳပံုကေတာ့
 ဥပမာ
 ၂၀၁၅ <abbr title="ေရြးေကာက္ပြဲ">မွာ</abbr> လုပ္မွာပါ
ေနာက္တခုကေတာ့ သူနဲ့ ပံုစံတူပါဘဲ <acronym> ဆိုတာပါ  အသံုးၿပဳပံုကေတာ့
မင္း ငါ့ကို<acronym title="ခ်စ္လား">ခလ</acronym>?
 

 

<address> 

ေနာက္တခုကေတာ့ <address> ပါ  သူကေတာ့ ဘယ္သူ ဘယ္အခ်ိန္မွာ ေရးပါတယ္ဆိုၿပီး ၿပဖို့အတြက္ ပါ သူကို အဓိကသံုးတာကေတာ့ ေရွ႕ကေရးခဲ့တဲ့ <a> tag နဲ့တြဲသံုးပါတယ္
 

ဥပမာ  

<address>
ေရးသားသူ<a href="http://tutorial-codes.blogspot.com/">မင္းထြန္း</a>.<br>
http://tutorial-codes.blogspot.com/<br>
န၀မင္၊ ၇၈ လမ္း၊ ဘန္ေကာက္<br>
ထိုင္းႏိုင္ငံ
</address> 
 


  <area>  

<area> ဆိုတာကေတာ့ image-map ေတြအတြင္းက အရြယ္အစား ေတြကို တိက်စြာ ေဖာ္ၿပႏိုင္ဖို့အတြက္ပါ 

 

 ဥပမာ 

<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm">
  <area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm">
  <area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm">
</map>
 

အေပၚကလို သံုးပါတယ္ shape,coords တို့ အခန္းေတြမွာ အၾကယ္တ၀င့္တြဲေလ့လာ ႏိုင္ပါတယ္ 
 

ေအာက္မွာ စမ္းၾကည့္ႏိုင္ပါတယ္

<!DOCTYPE html>
<html>
<body> <address>
ေရးသားသူ<a href="http://tutorial-codes.blogspot.com/">မင္းထြန္း</a>.<br>
http://tutorial-codes.blogspot.com/<br>
န၀မင္၊ ၇၈ လမ္း၊ ဘန္ေကာက္<br>
ထိုင္းႏိုင္ငံ
</address>
<p>၂၀၁၅ <abbr title="ေရြးေကာက္ပြဲ">မွာ</abbr> လုပ္မွာပါ .</p>
<p>မင္း ငါ့ကို<acronym title="ခ်စ္လား">ခလ</acronym>?</p>
</body>
</html>

Posted by at No comments:
Labels:

2015/08/02

a tag

<a> ဆိုတာကေတာ့ link ထည့္ေပးႏိုင္ဖို့ အသံဳးၿပဳၿခင္းၿဖစ္ပါတယ္
ဥပမာ

<a href="http://tutorial-codes.blogspot.com/">Tutorial!</a>

ယခုလိုေရးထားတယ္ဆိုရင္ ၿမင္ရမွာက  

Tutorial!

ဆိုၿပီးၿမင္ရမွာပါ သူနဲ့တြဲသံဳးရတာေတြကေတာ့

Month           Savings          Savings
charset char_encoding character-set ေတြကို လိုသလို ၿပဳၿပင္ဖို့ပါ
coords coordinates coordinates
download ဖိုင္နာမည္ ကလစ္လိုက္တာနဲ့ ေဒါင္းေလ့ာ ၿပဳလုပ္ေပးနိုင္ဖို့ သံုးႏိုင္ပါတယ္
href URL လို့ေခၚတဲ့ Uniform Resource Locader အတြက္ပါ link ေတြကို ေဖာ္ၿပေပးဖို့အတြက္ပါ
hreflang language_code link ေတြရဲ့ ဘာသာရပ္ကို ေဖာ္ၿပဖို့အတြက္
media ဖုန္း၊ ကြန္ပ်ဴတာ၊တီဗြီ စတာေတြေပၚမွာ ၿမင္ကြင္း အရည္အေသြး သက္မွတ္ဖို့ပါ link တခုကို ကိုၿမင္ေစခ်င္တဲ့ အရည္အေသြးနဲ့ ၿမင္ရေစဖို့အတြက္ အသံုးၿပဳပါတယ္
name section name web page ေပၚက စာေတြအမ်ားၾကီးထဲမွာ ကလစ္လိုက္တာနဲ့ ညႊန္ၿပထားတဲ့ စာသားေနရာေရာက္သြားဖို့အတြက္သံုးပါတယ္
rel next, prev,search,tag, web page ေပၚက ဆက္ႏြယ္မႈ႕ရွိတဲ့ ပို့စ္ေတြကို တခုနဲ့တခု ဆက္ဖြင့္ႏိုင္ဖို့အတြက္ပါ
shape default
rect
circle
poly		 link ေတြကို shape ထည့္ေပးဖို့အတြက္ပါ
target open new window, open new tab web page ေပၚက link တခုကို ကိုပြင့္ေစခ်င္သလို ပြင့္ႏိုင္ဖို့အတြက္ပါ

အခုေတာ့ <a> အေၾကာင္းေရးတာၿဖစ္လို့ <a> နဲ့ပတ္သက္တာေတြအထက္မွာ ေလ့လာၿပီး ဒီကုတ္ေလးေတြကို လက္ေတြ့ ထက္ေလ့လာၾကည့္ရေအာင္ပါ ေအာက္ကေပးထားတဲ့ ကုတ္ေလးေတြကို ဘေလာ့ရဲ့ ေအာက္ဆံုးမွာရွိတဲ့ လက္ေတြ႕လုပ္ေဆာင္ရန္ဆိုတဲ့ ေအာက္က ဘယ္ဘက္ အၿခမ္းက စာေတြအကုန္ၿဖတ္ၿပီး ထည့္လိုက္ပါ ၿပီးရင္ Seeb Result ဆိုတာကိုႏွိပ္လိုက္ရင္ ညာဘက္မွာ ေရးထားတဲ့ကုတ္ေတြ အလုပ္လုပ္ပံုကိုေတြ႕ရပါၿပီ

<!DOCTYPE html>
<html>
<body>
<p>
<a href="http://tutorial-codes.blogspot.com/">Tutorial!</a>
<br/>
<a charset="UTF-8" href="http://tutorial-codes.blogspot.com/"target="_blank">willcome</a>
<br/>
<a href="http://tutorial-codes.blogspot.com/"target="_blank">willcome</a>
</p>
 </body>
</html>
Posted by at No comments:
Labels:

tag

<!> ဆိုတာကေတာ့ ကုတ္ေတြၾကားထဲမွာ ရွင္းလင္းခ်က္ထည့္ေပးႏိုင္ဖို့အတြက္သံုးႏိုင္ပါတယ္
ဥပမာ
<!DOCTYPE html>
<html>
<body>

<!---ဒါက စာပိုဒ္တစ္ခုပါ -->
<p>This is a paragraph.</p>
<!-- ဒါေတြနဲ့သာလွ်င္အလုပ္လုပ္ပါတယ္ -->

</body>
</html>
အဲလိုေရးထားမယ္ဆိုရင္ ကုတ္ေတြ ရမ္းၾကည့္တဲ့အခါ <! ---> ေရးထားတာေတြ ေပၚမွာမဟုတ္ပါဘူး

<!DOCTYPE html> ဆိုတာကေတာ့ မိမိေရးထားတဲ့ ကုတ္ေတြကို web browser ကေန သိေအာင္ ၿပဳလုပ္ေပးၿခင္းဘဲၿဖစ္ပါတယ္ Version အလိုက္ ကြဲၿပားၾကပါတယ္






Posted by at No comments:
Labels:

HTML ကို စတင္ေလ့လာၿခင္း

HTML ဆိုတာကေတာ႕ Hyper Text Markup Language ရဲ႕ အတိုသံုးပါ
၀ပ္ဆိုဒ္ ေပၚက အခ်စ္အလပ္ေတြကို ေဖာ္ၿပဳဖို့အတြက္ ဘာသာရပ္တခုၿဖစ္ပါတယ္

       Version                            Year
        HTML 1991
        HTML 2.0 1995
        HTML 3.2 1997
        HTML 4.01 1999
        XHTML 2000
        HTML5 2014  


အေၿခခံ ေရးသားပံုကေတာ႕

<html>
<head>
<title>Page title</title>
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
</body>
</html>



<!DOCTYPE html>
<html>

<head>
<title>Page Title</title>
</head>

<body>

<h1>This is a heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

</body>

</html>  

အထက္မွာ ေဖာ္ၿပထားတဲ့ နမူနာကို ေလ့လာၾကည့္ရေအာင္ပါ angle brackets ( < > ) စၿပီး angle brackets ( </ > ) နဲ႕ ဆံုးထားတာကို ေတြ႕ရပါတယ္ ဒီသေဘာတရားကိုနားလည္ရင္ ေရးထားတဲ့ ကုတ္ေတြကို ေမာင္းႏွင္ၾကည့္ရေအာင္ပါ

<!DOCTYPE html> ဆိုတာကေန </html> ဆိုတဲ့အထိ ေကာ္ပီကူၿပီး Notepad သို့မဟုတ္ wordpad ထဲမွာ ထည့္လိုက္ပါ
ၿပီးရင္ File/Save AS ကေန သိမ္းမဲ့ေနရာ ေမးလာရင္ file name ကိုႏွစ္သက္ရာ အမည္ေပးၿပီး အမည္ရဲ့ေနာက္က  .html ဆိုၿပီး နာမည္ေပးလိုက္ပါ Save as type ေနရာမွာ All File ကိုေရြးေပးၿပီး Encoding ဆိုတဲ့ေနရာကို UTF-8 ကိုေရြးေပးၿပီး Save လုပ္လိုက္ပါ
အခု ကၽြန္ေတာ္ Desktop ေပၚမွာ myfirst.html ဆိုၿပီး Save လိုက္လို့ myfirst ဆိုတဲ့ firefox ပံုေလးနဲ့ shortcut ဖိုင္တဖိုင္ေရာက္လာပါၿပီ 
အဲဒီ shortcut ေလးဖြင့္လိုက္ရင္ေတာ့ HTML ဘာသာရပ္နဲ့ ေရးထားတာေတြ စတင္ အလုပ္လုပ္ပါၿပီ

တမ်ိဳးၿခင္းစီရဲ႕လုပ္ေဆာင္ႏိုင္မႈ႕ေတြကို ဆက္လပ္ေလ့လာႏိုင္ပါၿပီ

Posted by at No comments:
Labels:
Subscribe to: Comments (Atom)