HTML <source> Tag
ဥပမာ
အရင်းအမြစ်ဖိုင်နှစ်ခုပါသော အသံဖွင့်စက်။ ဘရောက်ဆာသည် ၎င်းကို ပံ့ပိုးပေးသည့် ပထမဆုံး <source> ကို ရွေးပါမည်-
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
အောက်တွင် နောက်ထပ် "စမ်းသုံးကြည့်ပါ" ဥပမာများ။
အဓိပ္ပါယ်နှင့် အသုံးပြုမှု
<video> ၊ <audio> နှင့် <picture><source> ကဲ့သို့သော မီဒီယာဒြပ်စင်များအတွက် များစွာသော မီဒီယာအရင်းအမြစ်များကို သတ်မှတ်ရန် တဂ်ကို အသုံးပြု
ပါသည် ။
ဘ <source>ရောက်ဆာပံ့ပိုးမှု သို့မဟုတ် မြင်ကွင်းပို့အကျယ်အပေါ် အခြေခံ၍ ဘရောက်ဆာမှ ရွေးချယ်နိုင်သည့် အခြားဗီဒီယို/အသံ/ပုံဖိုင်များကို တဂ်က သတ်မှတ်ခွင့်ပြုသည်။ <source>
ဘရောက်ဆာ သည် ၎င်းကို ပံ့ပိုးပေး မည့် ပထမဆုံးအရာကို ရွေးချယ်မည်ဖြစ်သည် ။
Browser ပံ့ပိုးမှု
ဇယားရှိ နံပါတ်များသည် ဒြပ်စင်ကို အပြည့်အဝထောက်ခံသည့် ပထမဆုံးဘရောက်ဆာဗားရှင်းကို သတ်မှတ်ပေးသည်။
| Element | |||||
|---|---|---|---|---|---|
| <source> | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
ဂုဏ်တော်
| Attribute | Value | Description |
|---|---|---|
| media | media_query | Accepts any valid media query that would normally be defined in a CSS |
| sizes | Specifies image sizes for different page layouts | |
| src | URL | Required when <source> is used in <audio> and <video>. Specifies the URL of the media file |
| srcset | URL | Required when <source> is used in <picture>. Specifies the URL of the image to use in different situations |
| type | MIME-type | Specifies the MIME-type of the resource |
ကမ္ဘာလုံးဆိုင်ရာ အရည်အချင်းများ
<source>tag သည် HTML တွင် Global Attributes ကို ပံ့ပိုး ပေးပါသည်။
ဖြစ်ရပ်ဂုဏ်တော်များ
<source>tag သည် HTML ရှိ Event Attributes ကိုလည်း ပံ့ပိုး ပေးပါသည် ။
နောက်ထပ် ဥပမာများ
ဥပမာ
ဗီဒီယိုကိုဖွင့်ရန် <video> အတွင်း <source> ကိုသုံးပါ
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
ဥပမာ
viewport အကျယ်ကိုအခြေခံ၍ မတူညီသောပုံများကိုသတ်မှတ်ရန် <source> ကိုသုံးပါ-
<picture>
<source media="(min-width:650px)" srcset="img_pink_flowers.jpg">
<source media="(min-width:465px)" srcset="img_white_flower.jpg">
<img
src="img_orange_flowers.jpg" alt="Flowers" style="width:auto;">
</picture>
ဆက်စပ်စာမျက်နှာများ
HTML သင်ခန်းစာ- HTML ဗီဒီယို
HTML သင်ခန်းစာ- HTML အသံ
HTML DOM ရည်ညွှန်းချက်- အရင်းအမြစ်အရာဝတ္တု
မူရင်း CSS ဆက်တင်များ
တစ်ခုမှ