HTML ပုံမ်ား - Tag နဲ႔ Src Attribute

HTML ပုံမ်ား - Tag နဲ႔ Src Attribute

HTML ပုံမ်ား - <img> Tag နဲ႔  Src Attribute

HTML မွာ ပုံေတြကုိ  <img> tag နဲ႔ သတ္မွတ္ၾကပါတယ္။
<img> tag သီးသန္႔ဆုိရင္ ဗလာ ၾကီးျဖစ္ျပီး Attribute ေတြ သက္သက္ပဲပါမွာပါ။ Tag အပိတ္လည္းမရွိပါဘူး။
စာမ်က္ႏွာေပၚမွာ ပုံေပၚဖုိ႔အတြက္ src attribute ကိုသုံးဖုိ႔လုိပါတယ္။ Src ဆုိတာက "source" ရဲ့အတုိေကာက္စာလုံးျဖစ္ျပီး  src attribute ရဲ့တန္ဖုိးက သင္ေပၚခ်င္တဲ့ ပုံရဲ့ URL လည္းျဖစ္ပါတယ္။
ပုံအတြက္ Syntax

<img src="url" alt="some_text"/> 

URL ကပုံဘယ္မွာရွိလဲ ျပပါတယ္။ "trip.jpg" လုိနာမည္ရွိတဲ့ ပုံတစ္ပုံမွာ www.aungsanmks.com ရဲ့ images folder (Directory) ထဲမွာရွိတယ္ဆုိရင္ URL က http://i.minus.com/ibidJBu0i95gl8.PNG
Browser (ဘေရာက္ဆာ) က Image Tag ျပတဲ့ပုံကုိ ေခၚသုံးပါတယ္။ တကယ္လုိ႔ စာပုိဒ္ႏွစ္ခုၾကား
ပုံထားခဲ့ရင္ Browser (ဘေရာက္ဆာ) က ပထမစာပုိဒ္ကို အေရွ႕က ေပၚေစပါမယ္။ သူ႔ေအာက္မွာမွ သင္ညႊန္းထားတဲ့ပုံ သူျပီးမွ ေနာက္ဆုံးစာပုိဒ္ကုိ ေပၚေစမွာပါ။  

---

HTML ပုံမ်ား - Alt Attribute

လုိအပ္တဲ့ alt attribute ဟာ ပုံအတြက္ အျခားနည္းလမ္းနဲ႔ေပၚမယ့္စာျဖစ္ပါတယ္။ ပုံေပၚဖုိ႔ အဆင္မေျပတဲ့ အခါမ်ိဳးမွာျဖစ္ပါတယ္။
Alt attribute ရဲ့တန္ဖုိးကေတာ့ ဝဘ္ဆုိဒ္ ေရးသူ ထည့္တဲ့အတိုင္းပါပဲ...။

<img src="trip.jpg" alt="Blogger Aung Aung" /> 

alt attribute က အင္တာနက္လုိင္း ေႏွးလုိ႔ ပုံေတြမေပၚႏိုင္ေသးရင္ပဲျဖစ္ျဖစ္၊ Src Attribute မွာ အမွားတစ္ခုခုရွိလုိ႔ပဲျဖစ္ျဖစ္ ၾကည့္ရႈ႔သူဟာ Screen Reader ကုိအသုံးျပဳျပီးၾကည့္လုိ႔ပဲျဖစ္ျဖစ္ ပုံေတြကို Browser (ဘေရာက္ဆာ) က ခ်က္ခ်င္းေဖၚျပဖုိ႔မတတ္ႏုိင္တဲ့ အခ်ိန္မွာလည္း alt ေပးထားတဲ့ (သတ္မွတ္ထားတဲ့) စာကုိ အရင္ေပၚေနေစမွာျဖစ္ပါတယ္။

---

HTML ပုံမ်ား - ပုံအျမင့္နဲ႔ အလ်ားကုိ သတ္မွတ္ျခင္း

အျမင့္နဲ႔ အလ်ား attribute ေတြမွာ ပုံ၏ အျမင့္နဲ႔ အလ်ားအတြက္ျဖစ္ပါတယ္။
Attribute တန္ဖုိးေတြကိုေတာ့ အျမဲ Pixel နဲ႔ သတ္မွတ္ပါတယ္။

<img src="trip.jpg" alt="Blogger Aung Aung" width="334" height="227" />

မွတ္ခ်က္ — ပုံအတြက္ အျမင့္နဲ႔ အလ်ား Attribute ေတြကို ေသခ်ာ စီစဥ္သင့္ပါတယ္။ သတ္မွတ္ထားတဲ့တန္ဖုိး အတိုင္း ပုံရဲ့ အရြယ္အစားကုိ စာမ်က္ႏွာ loading ျဖစ္ေနစဥ္မွာ ေနရာခ်မွာျဖစ္ပါတယ္။ဒါေပမယ့္ ဒီ attribute ေတြမပါခဲ့ဘူးဆုိရင္ browser (ဘေရာက္ဆာ) က ပုံအရြယ္အစားကုိ သိမွာ မဟုတ္ ပါဘူး။ ပုံေပၚလာဖုိ႔ဆြဲတင္ေနခ်ိန္မွာ စာမ်က္ႏွာအေနအထားကေျပာင္းတဲ့ effect ျဖစ္လာေစပါလိမ့္မယ္။

---

မွတ္စုမ်ား

မွတ္ခ်က္ — တကယ္လုိ႔ HTML ဖုိင္မွာ ပုံ ၁ဝ ပုံပါခဲ့ပါက အဲဒီ့စာမ်က္ႏွာအတြက္ ဖိုင္ ၁၁ ခုကုိ ဖြင့္ရတာနဲ႔တူပါတယ္။ ပုံေတြေပၚလာဖုိ႔ဆြဲတင္ရတာလည္း အခ်ိန္ေပးရပါတယ္။ ဒါေၾကာင့္ပုံေတြကုိ ထည့္သုံးမယ္ဆုိ အရြယ္အစားကအစ ဂရုစုိက္ဖုိ႔ အၾကံျပဳခ်င္ပါတယ္။
မွတ္ခ်က္ — ဝဘ္စာမ်က္ႏွာ တက္ေနတဲ့အခ်ိန္မွာ Browser (ဘေရာက္ဆာ) ကေန Web Server ကပုံေတြကုိ ယူျပီး စာမ်က္ႏွာထဲကုိ ထည့္ေပးတာျဖစ္ပါတယ္။ ဒါေၾကာင့္ ထည့္ထားတဲ့ပုံဟာ ကုိယ္ေပးထားတဲ့ လမ္းေၾကာင္းအမွန္မွာ တကယ္ရွိရဲ့လားဆုိတာကုိ ေသခ်ာအတည္ျပဳဖုိ႔လုိပါတယ္။ လြဲခဲ့ရင္ေတာ့ ပုံမေပၚပဲ အဲဒီ႔ေနရာမွာ ကြက္လပ္တစ္ခုေပၚေနမွာျဖစ္ပါတယ္။ ဒါဟာ Browser (ဘေရာက္ဆာ) ကရွာေပးဖုိ႔ မတတ္ႏုိင္ေတာ့တဲ့ အေျဖျဖစ္ပါတယ္။

---

HTML ပုံ Tag မ်ား

Tag	အေၾကာင္းအရာ
<img />	ပုံထည့္ရန္
<map>	image-map ထည့္ရန္
<area />	image-map တစ္ခုထဲက ႏွိပ္လုိ႔ရတဲ့ ေနရာတစ္ခုအျဖစ္ သတ္မွတ္ပါတယ္။

လူႀကီးမင္း(ေကာ့ေသာင္း)နည္းပညာမွတ္စုမ်ား