این آموزش در تاریخ ۱۴۰۲/۰۶/۲۳ آپدیت شده است.
آموزش تگ track در HTML
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش تگ track در HTML با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
تگ Track در HTML
تگ track تگی است که با استفاده از آن میتوان یک محتوای متنی را به یک رسانه ( مثه یک فایل ویدئویی یا صوتی ) اضافه نمود.
این محتوای متنی که میگیم در واقع میتونه یک فایل زیرنویس باشه و یا میتونه یک فایل متنی برای ایجاد عنوان یا شرح توضیحاتی برای اون فایل رسانه مون باشه.
بفرض مثال ما میخوایم یه فایل زیرنویس فارسی به ویدئومون اضافه کنیم ، پس باید از تگ Track برای تعریف زیرنویس و قرار دادنش در زیر ویدئو استفاده کنیم.
پیشنهاد میکنم آموزش نحوه قرار دادن ویدئو در صفحات وب را مشاهده نمایید.
Free-Learn
مثال از تگ track در HTML
در ادامه میتوانید یک مثال از این تگ را مشاهده نمایید.
مثال شماره ۱ : اضافه کردن فایل زیرنویس فارسی به ویدئو
|
1 2 3 4 5 6 7 8 |
<body> <video controls width="400" height="230"> <source src="files/demo.mp4" type="video/mp4"> <track src="files/subtitle.vtt" kind="subtitles" srclang="fa" label="فارسی" default> </video> </body> |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از تگ track در HTML پشتیبانی میکنند یا خیر.
| نام مرورگر | Chrome | Firefox | Opera | Safari | Edge |
| پشتیبانی | بله | بله | بله | بله | بله |
Free-Learn
جدول صفات تگ track در HTML
در جدول زیر میتوانید صفات بهمراه مقادیری را که میتوان در این تگ استفاده کرد را مشاهده نمایید.
| نام صفت | مقدار | توضیح |
|---|---|---|
| default | default | مشخص میکند که فایل Track بصورت پیش فرض با اجرای فایل رسانه نمایش داده شود |
| kind | captions chapters descriptions metadata subtitles |
نوع متن رسانه را مشخص میکند ( مثلا برای زیرنویس باید گزینه subtitles را انتخاب نمایید ) |
| label | text | یک عنوان برای Track مشخص میکند |
| src | URL | آدرس URL فایل Track را مشخص میکند ( استفاده از این صفت در درون تگ Track ضروری می باشد ) |
| srclang | language_code | زبان متنی فایل Track را مشخص میکند ( مثلا برای استفاده از زیرنویس ،باید از این صفت نیز برای مشخص بودن زبان زیرنویس استفاده نمایید ) |
Free-Learn
پشتیبانی از صفات و رویدادهای عمومی
تگ track از صفات عمومی و رویدادهای عمومی در HTML پشتیبانی می کند.
Free-Learn
نکات و توضیحات
- برای مشاهده کد زبان های کشورها لطفا اینجا کلیک نمایید.
توجه داشته باشید که فایل زیرنویس شما باید حتما از نوع vtt باشد نه srt یا دیگر فرمت ها.
با استفاده از این وبسایت میتوانید یک زیرنویس که از نوع srt است را به یک زیرنویس از نوع vtt تبدیل نمایید.
