HTML အရည်အချင်းများ
HTML ရည်ညွှန်းချက်များသည် HTML ဒြပ်စင်များအကြောင်း နောက်ထပ်အချက်အလက်များကို ပေးဆောင်သည်။
HTML အရည်အချင်းများ
- HTML ဒြပ်စင်များအားလုံးတွင် attribute များ ရှိနိုင်ပါသည်။
- ရည်ညွှန်းချက်များသည် ဒြပ်စင်များအကြောင်း နောက်ထပ်အချက်အလက်များကို ပေးဆောင်သည်။
- ရည်ညွှန်းချက်များကို စတင်တက်ဂ် တွင် အမြဲသတ်မှတ်ထားသည်။
- ရည်ညွှန်းချက်များသည် အများအားဖြင့် နာမည်/တန်ဖိုးအတွဲများဖြစ်သည့်- name="value"
href Attribute ၊
tag သည် ဟိုက် <a>ပါလင့်ခ်ကို သတ်မှတ်သည်။ hrefရည်ညွှန်းချက်သည် လင့်ခ်သို့သွားသော စာမျက်နှာ၏ URL ကို သတ်မှတ်သည် -
ဥပမာ
<a href="https://www.w3schools.com">Visit W3Schools</a>
ကျွန်ုပ်တို့၏ HTML Links အခန်း တွင် လင့်ခ်များအကြောင်း ပိုမိုလေ့လာနိုင်ပါမည် ။
src Attribute သည်
tag ကို <img>HTML စာမျက်နှာတစ်ခုတွင် ပုံတစ်ပုံထည့်သွင်းရန် အသုံးပြုသည်။ srcရည်ညွှန်းချက်သည် ပြသမည့် ပုံသို့ လမ်းကြောင်းကို သတ်မှတ်ပေးသည် -
ဥပမာ
<img src="img_girl.jpg">
src
ရည်ညွှန်းချက် တွင် URL ကို သတ်မှတ်ရန် နည်းလမ်းနှစ်ခုရှိသည် ။
1. Absolute URL - အခြားဝဘ်ဆိုဒ်တွင် လက်ခံကျင်းပသည့် ပြင်ပရုပ်ပုံထံသို့ လင့်ခ်များ ဥပမာ- src="https://www.w3schools.com/images/img_girl.jpg" ။
မှတ်ချက်- ပြင်ပပုံများသည် မူပိုင်ခွင့်အောက်တွင် ရှိနေနိုင်သည်။ ၎င်းကိုအသုံးပြုရန် သင်ခွင့်ပြုချက်မရပါက၊ သင်သည် မူပိုင်ခွင့်ဥပဒေများကို ချိုးဖောက်ခြင်းဖြစ်နိုင်သည်။ ထို့အပြင်၊ သင်သည် ပြင်ပပုံများကို ထိန်းချုပ်၍မရပါ။ ရုတ်တရက် ဖယ်ရှားခြင်း သို့မဟုတ် ပြောင်းလဲနိုင်သည်။
2. Relative URL - ဝဘ်ဆိုက်အတွင်း လက်ခံကျင်းပသည့် ပုံသို့ လင့်ခ်များ။ ဤတွင်၊ URL တွင် ဒိုမိန်းအမည် မပါဝင်ပါ။ URL သည် မျဥ်းစောင်းမပါဘဲ စတင်ပါက၊ ၎င်းသည် လက်ရှိစာမျက်နှာနှင့် ဆက်စပ်နေမည်ဖြစ်သည်။ ဥပမာ- src="img_girl.jpg" URL သည် မျဥ်းစောင်းဖြင့် အစပြုပါက၊ ၎င်းသည် ဒိုမိန်းနှင့် ဆက်စပ်နေလိမ့်မည်။ ဥပမာ- src="/images/img_girl.jpg"။
အကြံပြုချက်- ဆွေမျိုး URL များကို အသုံးပြုခြင်းသည် အမြဲတမ်းနီးပါး အကောင်းဆုံးဖြစ်သည်။ ဒိုမိန်းပြောင်းရင် သူတို့ပျက်မှာမဟုတ်ဘူး။
width နဲ့ height က Attributes ပါ။
တဂ်တွင် ပုံ ၏ အကျယ်နှင့် အမြင့် ( pixels ဖြင့် သတ်မှတ်ပေးသည်) နှင့် attribute <img>များလည်း ပါဝင်သင့်သည်
-width
height
ဥပမာ
<img src="img_girl.jpg" width="500" height="600">
alt Attribute
တဂ်အတွက် လိုအပ်သော altရည်ညွှန်းချက်သည် <img>
အကြောင်းတစ်စုံတစ်ရာကြောင့် ပုံအား မပြသနိုင်ပါက ပုံတစ်ပုံအတွက် အစားထိုးစာသားကို သတ်မှတ်ပေးပါသည်။ ချိတ်ဆက်မှု နှေးကွေးခြင်းကြောင့် သို့မဟုတ် ရည်ညွှန်းချက်တွင် အမှားအယွင်းတစ်ခုကြောင့် srcသို့မဟုတ် အသုံးပြုသူသည် မျက်နှာပြင်ဖတ်စက်ကို အသုံးပြုပါက ဖြစ်နိုင်သည်။
ဥပမာ
<img src="img_girl.jpg" alt="Girl
with a jacket">
ဥပမာ
မရှိသောပုံတစ်ပုံကို ပြရန်ကြိုးစားပါက ဘာဖြစ်သွားသည်ကို ကြည့်ပါ။
<img src="img_typo.jpg" alt="Girl
with a jacket">
ကျွန်ုပ်တို့၏ HTML Images အခန်း တွင် ပုံများအကြောင်း ပိုမိုလေ့လာနိုင်ပါမည် ။
စတိုင်လ် Attribute
အရောင် style၊ ဖောင့်၊ အရွယ်အစားနှင့် အခြားအရာများကဲ့သို့ ဒြပ်စင်တစ်ခုသို့ စတိုင်များကို ပေါင်းထည့်ရန် ရည်ညွှန်းချက်ကို အသုံးပြုသည်။
ဥပမာ
<p style="color:red;">This is a red paragraph.</p>
ကျွန်ုပ်တို့၏ HTML Styles အခန်း တွင် စတိုင်များအကြောင်း ပိုမိုလေ့လာနိုင်ပါမည် ။
lang Attribute
ဝဘ်စာမျက်နှာ၏ဘာသာစကားကိုကြေငြာရန် သင် langက tag အတွင်းရှိ attribute ကို အမြဲထည့်သွင်းသင့်သည် ။ <html>၎င်းသည် ရှာဖွေရေးအင်ဂျင်များနှင့် ဘရောက်ဆာများကို ကူညီရန် ရည်ရွယ်သည်။
အောက်ပါဥပမာသည် အင်္ဂလိပ်ဘာသာစကားကို ဘာသာစကားအဖြစ် သတ်မှတ်သည်-
<!DOCTYPE html>
<html lang="en">
<body>
...
</body>
</html>
နိုင်ငံကုဒ်များကို ရည်ညွှန်းချက်ရှိ ဘာသာစကားကုဒ်သို့လည်း ထည့်သွင်းနိုင်သည် lang
။ ထို့ကြောင့် ပထမစာလုံးနှစ်လုံးသည် HTML စာမျက်နှာ၏ ဘာသာစကားကို သတ်မှတ်ပြီး နောက်ဆုံးစာလုံးနှစ်လုံးက နိုင်ငံကို သတ်မှတ်သည်။
အောက်ပါဥပမာသည် အင်္ဂလိပ်ဘာသာစကားအဖြစ်နှင့် United States နိုင်ငံအဖြစ် သတ်မှတ်သည်-
<!DOCTYPE html>
<html lang="en-US">
<body>
...
</body>
</html>
ကျွန်ုပ်တို့၏ HTML Language Code Reference တွင် ဘာသာစကားကုဒ်များအားလုံးကို သင်တွေ့မြင်နိုင်ပါသည် ။
ခေါင်းစဉ်က Attribute ပါ။
ရည်ညွှန်းချက်သည် ဒြပ်စင်တစ်ခု၏ အ titleပိုအချက်အလက်အချို့ကို သတ်မှတ်ပေးသည်။
ဒြပ်စင်ကို မောက်စ်ပေါ်တွင် မောက်စ်တင်သောအခါ ခေါင်းစဉ် attribute ၏တန်ဖိုးကို ကိရိယာအကြံပြုချက်အဖြစ် ပြသပါမည်-
ဥပမာ
<p title="I'm a tooltip">This is a paragraph.</p>
ကျွန်ုပ်တို့အကြံပြုချက်- စာလုံးအသေးများကို အမြဲသုံးပါ။
HTML စံနှုန်းသည် စာလုံးအသေး အရည်အချင်းအမည်များ မလိုအပ်ပါ။
title attribute (နှင့် အခြား attribute များအားလုံး) ကို title သို့မဟုတ် TITLE ကဲ့သို့ စာလုံးအကြီး သို့မဟုတ် စာလုံးသေးဖြင့် ရေးသားနိုင်သည် ။
သို့သော်၊ W3C သည် HTML တွင် စာလုံးအသေးများကို အကြံပြု ထားပြီး XHTML ကဲ့သို့သော တင်းကျပ်သော စာရွက်စာတမ်းအမျိုးအစားများအတွက် စာလုံးသေး attribute များကို တောင်းဆို သည်။
W3Schools တွင် ကျွန်ုပ်တို့သည် စာလုံးအသေးအမည်များကို အမြဲအသုံးပြုသည်။
ကျွန်ုပ်တို့အကြံပြုချက်- ရည်ညွှန်းချက်တန်ဖိုးများကို အမြဲကိုးကားပါ။
HTML စံနှုန်းသည် attribute တန်ဖိုးများအကြောင်း ကိုးကားချက်များ မလိုအပ်ပါ။
သို့သော်လည်း W3C သည် HTML တွင်ကိုးကားချက်များကို အကြံပြု ထားပြီး XHTML ကဲ့သို့သော တင်းကျပ်သောစာရွက်စာတမ်းအမျိုးအစားများအတွက်ကိုးကားချက်များကို တောင်းဆိုပါသည် ။
ကောင်းသည်-
<a href="https://www.w3schools.com/html/">Visit our HTML tutorial</a>မကောင်း
<a href=https://www.w3schools.com/html/>Visit our HTML tutorial</a>တခါတရံမှာ quotes တွေသုံးရမယ်။ နေရာလွတ်တစ်ခုပါရှိသောကြောင့် ဤဥပမာသည် ခေါင်းစဉ်၏ဂုဏ်ရည်ကို မှန်ကန်စွာပြသမည်မဟုတ်ပါ။
ဥပမာ
<p
title=About W3Schools>
W3Schools တွင် ကျွန်ုပ်တို့သည် attribute တန်ဖိုးများအကြောင်း ကိုးကားချက်များကို အမြဲသုံးပါသည်။
တစ်ခုတည်း သို့မဟုတ် နှစ်ချက်ကိုးကားများလား။
ရည်ညွှန်းချက်တန်ဖိုးများအကြောင်း နှစ်ထပ်ကိုးကားများသည် HTML တွင် အသုံးအများဆုံးဖြစ်သော်လည်း ကိုးကားချက်တစ်ခုတည်းကိုလည်း အသုံးပြုနိုင်သည်။
အချို့သောအခြေအနေများတွင်၊ attribute value ကိုယ်တိုင်က double quotes ပါနေသောအခါ၊ single quotes ကိုသုံးရန် လိုအပ်သည်-
<p title='John "ShotGun" Nelson'>
သို့မဟုတ် အပြန်အလှန်အားဖြင့်-
<p title="John 'ShotGun' Nelson">
အခန်းအကျဉ်းချုပ်
- HTML ဒြပ်စင်များအားလုံးတွင် attribute များ ရှိနိုင်ပါသည်။
hrefရည်ညွှန်းချက်<a>သည် လင့်ခ်သို့သွားသော စာမျက်နှာ၏ URL ကို သတ်မှတ်ပေးသည် ။srcရည်ညွှန်းချက်သည်<img>ပြသမည့် ပုံဆီသို့ လမ်းကြောင်းကို သတ်မှတ်ပေးသည် ။- ပုံ များအတွက် အရွယ်အစား အချက်အလက်
widthနှင့်heightဂုဏ်ရည်တော်များ<img> altရည်ညွှန်းချက်<img>သည် ပုံတစ်ပုံအတွက် အလှည့်ကျ စာသားတစ်ခုကို ပံ့ပိုးပေးသည် ။- အရောင်
style၊ ဖောင့်၊ အရွယ်အစားနှင့် အခြားအရာများကဲ့သို့ ဒြပ်စင်တစ်ခုသို့ စတိုင်များကို ပေါင်းထည့်ရန် ရည်ညွှန်းချက်ကို အသုံးပြုသည်။ - တက်ဂ် ၏
langရည်ညွှန်းချက်<html>သည် ဝဘ်စာမျက်နှာ၏ ဘာသာစကားကို ကြေညာသည်။ - ရည်ညွှန်းချက်သည် ဒြပ်စင်တစ်ခု၏ အ
titleပိုအချက်အလက်အချို့ကို သတ်မှတ်ပေးသည်။
HTML လေ့ကျင့်ခန်းများ
HTML ရည်ညွှန်းချက်
HTML ဒြပ်စင်တစ်ခုစီအတွက် အရည်အချင်းအားလုံး၏ အပြည့်အစုံစာရင်းကို ကျွန်ုပ်တို့၏- HTML Attribute ရည်ညွှန်းချက် တွင် ဖော်ပြထားပါသည် ။