آموزش تگ track در HTML
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش تگ track در HTML با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
تگ Track در HTML
تگ track تگی است که با استفاده از آن میتوان یک محتوای متنی را به یک رسانه ( ویدئویی یا صوتی ) اضافه نمود.
این محتوای متنی که میگیم میتونه یک فایل زیرنویس باشه و یا میتونه یک فایل متنی برای ایجاد عنوان یا توضیحاتی برای اون فایل رسانه مون باشه.
پیشنهاد میکنم آموزش نحوه قرار دادن ویدئو در صفحات وب را مشاهده نمایید.
Free-Learn
مثال از تگ track در HTML
در ادامه میتوانید یک مثال از این تگ را مشاهده نمایید.
در مثال زیر یک فایل زیرنویس فارسی به یک ویدئو اضافه شده است.
|
1 2 3 4 5 6 7 8 |
<body> <video width="400" height="230" controls> <source src="video/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 | IE |
| پشتیبانی | ۱۸٫۰ | ۳۱٫۰ | ۱۵٫۰ | ۶٫۰ | ۱۰٫۰ |
Free-Learn
جدول صفات تگ track در HTML
در جدول زیر میتوانید صفات بهمراه مقادیری را که میتوان در این تگ استفاده کرد را مشاهده نمایید.
| نام صفت | مقدار | توضیح |
|---|---|---|
| default | default | مشخص میکند که فایل Track بصورت پیش فرض با اجرای فایل رسانه نمایش داده شود. |
| kind | captions chapters descriptions metadata subtitles |
نوع متن رسانه را مشخص میکند. (مثلا برای زیرنویس باید گزینه subtitles را انتخاب نمایید) |
| label | text | یک عنوان برای Track مشخص میکند. |
| src | URL | مسیر یا محل فایل Track را مشخص میکند. (استفاده از این صفت در درون تگ Track ضروری می باشد) |
| srclang | language_code | زبان متنی فایل Track را مشخص میکند. (مثلا برای استفاده از زیرنویس ،باید از این صفت نیز برای مشخص بودن زبان زیرنویس استفاده نمایید) |
Free-Learn
پشتیبانی از صفات و رویدادهای عمومی
تگ track از صفات عمومی و رویدادهای عمومی در HTML پشتیبانی می کند.
Free-Learn
نکات و توضیحات
تگ track یک تگ جدید/اضافه شده در HTML5 می باشد.
برای مشاهده کد زبان های کشورها لطفا اینجا کلیک نمایید.
توجه داشته باشید که فایل زیرنویس شما باید حتما از نوع vtt باشد نه srt یا دیگر فرمت ها.
با استفاده از این وبسایت میتوانید یک زیرنویس که از نوع srt است را به یک زیرنویس از نوع vtt تبدیل نمایید.
