تگ source در HTML
با استفاده از تگ source در HTML آدرس فایل های منابع رسانه ای مانند تصاویر، ویدیو ها و فایل های صوتی را مشخص می کنیم.
مثال
در مثال زیر با استفاده از تگ <source>
فایل های صوتی عنصر <audio>
را مشخص و اضافه کردیم:
تعریف و کاربرد
تگ source در HTML تگی است که با استفاده از آن می توان یک منبع یا بطور کلی مسیر یک فایل را برای تگ های چند رسانه ای همچون <audio>
و <video>
و <picture>
مشخص کرد.
با استفاده از تگ <source>
می توانید چندین فایل را که مرورگر ها می توانند با توجه به پشتیبانی که از فایل های رسانه ای دارند مشخص کنید و اولین <source>
مشخص شده انتخاب می شود.
فرض کنید یک فایل صوتی دارید که از آن فایل صوتی چندین نسخه در فرمت های مختلف مثل mp3 ,ogg ,aac ,wav و… دارید. اکنون شما می توانید تمام این فرمت ها از فایل صوتی را به ترتیب اولویت در تگ <source>
در عنصر <audio>
قرار دهید. و مرورگر اولین تگ <source>
را فراخوانی میکند و اگر نتونست اون فرمت رو اجرا کنه میره سراغ سورس بعدی و اون رو اجرا میکنه.
پشتیبانی مرورگر ها
اعداد موجود در جدول اولین نسخه مرورگر را مشخص می کنند که به طور کامل عنصر را پشتیبانی می کند.
عنصر | |||||
---|---|---|---|---|---|
<source> | 4.0 | 9.0 | 3.5 | 4.0 | 10.5 |
خواص (attributes)
خاصیت | مقدار | توضیحات |
---|---|---|
media | media_query | برای مشخص کردن حالت های مختلف رسانه در صفحه وب استفاده می شود. (برای واکنش گرایی) |
sizes | اندازه های مختلف تصاویر را برای طرح بندی صفحه های مختلف مشخص می کند. (برای واکنش گرایی) | |
src | URL | URL یا مسیر فایل را مشخص می کند. |
srcset | URL | مسیر فایلی را که قرار است در حالت های مختلف صفحه نمایش اجرا شود را مشخص می کند. |
type | MIME-type | نوع رسانه را مشخص می کند. (مثلاً نوع رسانه فایل های ویدئویی از نوع mp4 می شود: video/mp4) |
خواص عمومی
تگ source
از خواص عمومی در HTML پشتیبانی می کند.
رویداد های عمومی
تگ source
از رویداد های عمومی در HTML پشتیبانی می کند.
تنظیمات پیش فرض CSS
هیچ دستور پیش فرض CSS ندارد.
مثال های بیشتر
آیا این مطلب برای شما مفید بود ؟