<source>
Misol
Ikkita manba fayliga ega audio pleyer. Brauzer o‘zi qo‘llab-quvvatlaydigan birinchi <source> ni tanlaydi:
<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>
O‘zingiz sinab ko‘ring »
Quyida ko‘proq "O‘zingiz sinab ko‘ring" misollari keltirilgan.
Ta’rif va qo‘llanilishi
<source> tegi <video>, <audio> va <picture> kabi media elementlari uchun bir nechta media resurslarini belgilashda ishlatiladi.
<source> tegi brauzer qo‘llab-quvvatlashi yoki viewport kengligiga qarab brauzer tanlashi mumkin bo‘lgan muqobil video/audio/rasm fayllarini belgilash imkonini beradi. Brauzer o‘zi qo‘llab-quvvatlaydigan birinchi <source> elementini tanlaydi.
Brauzerlarda qo‘llab-quvvatlash
Jadvaldagi raqamlar elementni to‘liq qo‘llab-quvvatlaydigan birinchi brauzer versiyasini ko‘rsatadi.
| Element | |||||
|---|---|---|---|---|---|
| <source> | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
Atributlar
| Atribut | Qiymat | Tavsif |
|---|---|---|
| media | media_query | Odatda CSS’da belgilanadigan har qanday yaroqli media so‘rovini qabul qiladi |
| sizes | Turli sahifa maketlari uchun rasm o‘lchamlarini belgilaydi | |
| src | URL | <source> <audio> va <video> ichida ishlatilganda majburiy. Media faylning URL manzilini belgilaydi |
| srcset | URL | <source> <picture> ichida ishlatilganda majburiy. Turli vaziyatlarda ishlatiladigan rasmning URL manzilini belgilaydi |
| type | MIME-type | Resursning MIME turini belgilaydi |
Global atributlar
<source> tegi HTML’dagi global atributlarni ham qo‘llab-quvvatlaydi.
Hodisa atributlari
<source> tegi HTML’dagi hodisa atributlarini ham qo‘llab-quvvatlaydi.
Ko‘proq misollar
Misol
Video ijro etish uchun <video> ichida <source> dan foydalanish:
<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>
O‘zingiz sinab ko‘ring »
Misol
Viewport kengligiga qarab turli rasmlarni belgilash uchun <picture> ichida <source> dan foydalanish:
<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>
O‘zingiz sinab ko‘ring »
Tegishli sahifalar
HTML darsligi: HTML Video
HTML darsligi: HTML Audio
HTML DOM ma’lumotnomasi: Source obyekti
Standart CSS sozlamalari
Yo‘q.
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!