13 of 133 menu

အတ် img

အတ် img သည် ရုပ်ပုံကိုဖန်တီးပေးသည်။ ရုပ်ပုံလမ်းကြောင်းကို attribute src တွင်ရေးသားပါသည်။ ပိတ်ထားရန် အတ် မလိုအပ်ပါ။

Attributes များ

Attribute ဖော်ပြချက်
src ရုပ်ပုံသို့ လမ်းကြောင်းကို သတ်မှတ်ပေးသည်။
မဖြစ်မနေထည့်သွင်းရမည့် attribute။
alt ရုပ်ပုံကိုမတွေ့ပါက (ဥပမာ၊ လမ်းကြောင်းမှားရေးထားပါက) ရုပ်ပုံအစား ပြသမည့် အစားထိုးစာသား။
မဖြစ်မနေထည့်သွင်းရမည့် attribute။ ပျက်ကွက်ပါက validator (HTML သို့မဟုတ် CSS ၏မှန်ကန်မှုကိုစစ်ဆေးသည့်ပရိုဂရမ်) က မနှစ်မြို့ဖွယ်ပြမည်။
width ရုပ်ပုံ၏အကျယ်၊ ပစ်ကယ်များဖြင့် (ဤအခြေအနေတွင် ယူနစ်များကိုမဖော်ပြပါ) သို့မဟုတ် ရုပ်ပုံ၏မိဘမှရာခိုင်နှုန်းဖြင့်။
height �ုပ်ပုံ၏အမြင့်၊ ပစ်ကယ်များဖြင့် (ဤအခြေအနေတွင် ယူနစ်များကိုမဖော်ပြပါ) သို့မဟုတ် ရုပ်ပုံ၏မိဘမှရာခိုင်နှုန်းဖြင့်။

အသေးစိတ်အချက်များ

ရုပ်ပုံအတွက် အကျယ်နှင့် အမြင့် နှစ်မျိုးလုံး သတ်မှတ်မထားပါက - ရုပ်ပုံသည် ၎င်း၏ လက်တွေ့ အရွယ်အစားကို ရှိမည်ဖြစ်သည်။ အမြင့်ကိုသာ သတ်မှတ်ထားပါက ရုပ်ပုံသည် သတ်မှတ်ထားသည့် အမြင့်သို့ရောက်ရှိပြီး ၎င်း၏ အချိုးအစားများမပျက်ယွင်းစေရန် အကျယ်သည် အလိုက်သင့်ညှိပေးမည်။

အကျယ်ကိုသာ သတ်မှတ်ထားပါက - အလားတူပင်၊ ရုပ်ပုံသည် အချိုးအစားများကိုထိန်းသိမ်းရန် အမြင့်ကို အလိုက်သင့်ညှိပေးမည်။

အကျယ်နှင့် အမြင့် နှစ်မျိုးလုံး သတ်မှတ်ထားပါက - ရုပ်ပုံ၏အချိုးအစားများသည် ပျက်ယွင်းနိုင်သည် (သို့မဟုတ်မပျက်နိုင်ပါ၊ သင်မှန်းဆသည့်အတိုင်း)။ အကျယ် သို့မဟုတ် အမြင့် (သို့မဟုတ် နှစ်မျိုးစလုံး) သည် လက်တွေ့ထက်ကြီးနေပါက ရုပ်ပုံသည် ကြီးလာမည်ဖြစ်သော်လည်း အရည်အသွေးတွင်ဆုံးရှုံးမည်။

ရုပ်ပုံများအတွက် အကျယ်နှင့်အမြင့်ကို attributes များဖြင့် (CSS မှတစ်ဆင့်မဟုတ်ဘဲ) သတ်မှတ်ရန် အကြံပြုအပ်ပါသည် - ဤနည်းဖြင့် browser သည် ရုပ်ပုံများကို ပိုမိုမြန်ဆန်စွာ ဆွဲချမည် - ရုပ်ပုံတစ်ခုစီရရှိပြီးနောက် ၎င်း၏အရွယ်အစားကို တွက်ချက်ရန် မလိုအပ်ပါ။

လက်တွေ့ရုပ်ပုံ၏အရွယ်အစားများကို မလိုအပ်ဘဲ လျှော့ချရန် အကြံမပြုပါ။ ဥပမာ၊ ရုပ်ပုံ၏လက်တွေ့အရွယ်အစားသည် 1000 x 1000 ပစ်ကယ်များ၊ ပြီးတော့ သင်က ၎င်းကို အကျယ် 100px ဟုသတ်မှတ်လိုက်သည်။ ဤအခြေအနေတွင် ရုပ်ပုံသည် စခရင်ပေါ်တွင် 100 ပစ်ကယ်များအဖြစ်ပေါ်လာမည်၊ သို့သော် ပစ်ကယ်တစ်ထောင်စလုံးအရွယ်အစားရှိပြီး၊ ထို့ကြောင့် များစွာပိုမိုကြာမြင့်စွာ ဆွဲချရမည်။

ဥပမာ

ဝဘ်ဆိုက်ပေါ်သို့ ရုပ်ပုံတစ်ခုထည့်ကြပြီး attributes height နှင့် width တို့ကို မသတ်မှတ်ကြပါစို့။ ရုပ်ပုံသည် ၎င်း၏လက်တွေ့အရွယ်အစားကို ရှိမည်:

<img src="monkey.png" alt="မျောက်ဝံလေး">

:

ဥပမာ

ရုပ်ပုံအတွက် attribute width ကို အသုံးပြု၍ အကျယ်သတ်မှတ်ကြည့်ကြပါစို့။ ဤသို့ပြုလုပ်ရာတွင် အမြင့်သည် ရုပ်ပုံ၏အချိုးအစားများကိုထိန်းသိမ်းရန် အလိုက်သင့်ညှိပေးသင့်သည်:

<img src="monkey.png" width="200" alt="မျောက်ဝံလေး">

:

ဥပမာ

ယခုတစ်ကြိမ် ရုပ်ပုံအတွက် attribute height ကို အသုံးပြု၍ အမြင့်သတ်မှတ်ကြည့်ကြပါစို့။ ဤသို့ပြုလုပ်ရာတွင် အကျယ်သည် ရုပ်ပုံ၏အချိုးအစားများကိုထိန်းသိမ်းရန် အလိုက်သင့်ညှိပေးသင့်သည်:

<img src="monkey.png" height="100" alt="မျောက်ဝံလေး">

:

ဥပမာ

ရုပ်ပုံအတွက် အမြင့်နှင့် အကျယ် နှစ်မျိုးလုံးကို တစ်ပြိုင်နက်ထဲထည့်ကြည့်ကြပါစို့။ ဤသို့ပြုလုပ်ရာတွင် ရုပ်ပုံ၏အချိုးအစားများသည် ပျက်ယွင်းသွားသင့်သည် (မဖြစ်မနေမဟုတ်ပါ၊ သို့သော် ဤကိစ္စတွင် အမြင့်နှင့်အကျယ်ကို အချိုးအစားများပျက်ယွင်းစေရန် ရွေးချယ်ထားသည်):

<img src="monkey.png" height="100" width="300" alt="မျောက်ဝံလေး">

:

ဥပမာ

ရုပ်ပုံအတွက် လမ်းကြောင်းမှားယွင်းစွာထည့်ကြည့်ကြပါစို့ (ရိုးရှင်းစေရန် လမ်းကြောင်းကို ဗလာထားပါမည်)။ ရုပ်ပုံအစား attribute alt ၏အကြောင်းအရာကို မြင်တွေ့ရမည် (ဤသည်မှာ ပုံမှန်စာသားဟုထင်ရသော်လည်း ၎င်းကို ကူးယူကြည့်ပါ - မည်သည့်အရာမျှမရပါ၊ ၎င်းသည် ရုပ်ပုံတစ်ခုကဲ့သို့ ဆွဲဆောင်သွားမည်):

<img src="" alt="မျောက်ဝံလေး">

:

ဆက်လက်ဖတ်ရှုရန်

  • property width,
    သည် element ၏အကျယ်ကိုသတ်မှတ်ပေးသည်
  • property height,
    သည် element ၏အကျယ်ကိုသတ်မှတ်ပေးသည်
  • အတ် figure,
    သည် ရုပ်ပုံများနှင့် ၎င်းတို့၏ခေါင်းစဉ်များကို စုစည်းပေးသည်
  • အတ် figcaption,
    သည် ရုပ်ပုံအတွက် ခေါင်းစဉ်ကို သတ်မှတ်ပေးသည်
  • property background-image,
    သည် နောက်ခံရုပ်ပုံကို သတ်မှတ်ပေးသည်
မြန်မာ
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolEestiSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItaliano日本語ქართულიҚазақ한국어КыргызчаLietuviųLatviešuМакедонскиMelayuNederlandsNorskPolskiPortuguêsRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliТоҷикӣไทยTürkmenTürkçeЎзбекOʻzbekTiếng Việt
ဝက်ဘ်ဆိုက် လုပ်ဆောင်ခြင်း၊ ဆန်းစစ်လေ့လာခြင်းနှင့် ပုဂ္ဂလိကပြုပြင်ခြင်းအတွက် ကျွန်ုပ်တို့သည် cookie များကို အသုံးပြုပါသည်။ ဒေတာများကို ပြုပြင်ခြင်းသည် ကိုယ်ရေးကိုယ်တာ မူဝါဒအတိုင်း ဖြစ်ပါသည်။
အားလုံးလက်ခံရန် ပြင်ဆင်ရန် ငြင်းပယ်ရန်