معرفی و کاربرد تگ video در HTML
در این مقاله از سایت آموزی جهت استفاده شما همراهان همیشگی به معرفی و کاربرد تگ <video> در HTML می پردازیم.
تگ <video> در HTML
تگ <video> مشخص کننده ویدئو مانند کلیپ فیلم و یا دیگر جریان های ویدئویی است.
در حال حاضر،برای تگ <video> مرورگرها از سه فرمت ویدئویی MP4 ،WebM و Ogg پشتیبانی می کنند.
- MP4: فایل های MPEG 4 با کدک تصویری H264 و کدک صوتی AAC
- WebM: فایل های WebM با کدک تصویری VP8 و کدک صوتی Vorbis
- Ogg: فایل های Ogg با کدک تصویری Theora و کدک صوتی Vorbis
انواع MIME برای فرمت های ویدئویی
Format | MIME-type |
---|---|
MP4 | video/mp4 |
WebM | video/webm |
Ogg | video/ogg |
مثال در مورد تگ <video> در اچ تی ام ال
<source src=”movie.mp4″ type=”video/mp4″>
<source src=”movie.ogg” type=”video/ogg”>
Your browser does not support the video tag.
</video>
بررسی تگ <video> در HTML 4.01 و HTML5
تگ <video> یک تگ جدید در HTML5 است. و در HTML4.01 و نسخه های قدیمی تر وجود نداشته است.
خصوصیات ویژه تگ <video> در HTML
خصوصیت | مقدار | توضیحات |
---|---|---|
autoplay | autoplay | در صورتی که وجود داشته باشد ویدئو به محض اینکه آماده شود خود به خود پخش می شود. |
controls | controls | برای افزودن کنترل های play ،pause و صدا بکار برده می شود. |
height | pixels | ارتفاع پخش کننده ویدئو را تنظیم می کند. |
loop | loop | در صورت وجود پس از اتمام نمایش ویدئو پخش آن دوباره شروع می شود. |
muted | muted | مشخص کننده قطع صدا به طور پیش فرض برای ویدئو است. |
poster | URL | مشخص کننده تصویری است که به عنوان پیش نمایش ویدئو از آن استفاده می کند. مقدار آن یک url یا آدرس اینترنتی است. |
preload | auto metadata none |
در صورت وجود ویدئو در زمان لود صفحه، لود شده و آماده اجرا می شود. اگر autoplay وجود داشته باشد این خاصیت نادیده گرفته می شود. |
src | URL | آدرس ویدئویی که باید پخش شود. |
width | pixels | پهنای پخش کننده ویدئو را تنظیم می کند. |
ویژگی های عمومی تگ <video> در HTML
تگ <video> از کلیه ویژگی های عمومی در سند HTML پشتیبانی می کند.
رویدادهای عمومی تگ <video> در HTML
تگ <video> از کلیه رویدادهای عمومی در سند HTML پشتیبانی می کند.
پشتیبانی مرورگرها از تگ <video> در اچ تی ام ال
در زیر مرورگرهای معتبر اینترنتی از اولین نسخه هایی که از تگ <video> پشتیبانی می کنند، آمده است:
تگ | فایرفاکس | اینترنت اکسپلورر | گوگل کروم | سافاری | اپرا |
output | 4.0 به بالا | پشتیبانی نمی شود | 10.0 به بالا | 5.1 به بالا | 11.0 به بالا |
جهت دیدن تمام ردیف و ستون ها در حالت موبایلی جدول را به چپ و راست اسکرول کنید.
برای متخصص شدن در طراحی سایت فروشگاهی با وردپرس روی لینک زیر کلیک کن و تو دوره ثبت نام کن:
دوره فوق حرفه ای طراحی سایت فروشگاهی با وردپرس پروژه محور
برای متخصص شدن در طراحی بخش Front End سایت روی لینک زیر کلیک کن و تو دوره ثبت نام کن:
دوره فوق حرفه ای آموزش طراحی سایت با HTML5 و CSS3 و jQuery
برای متخصص شدن در بهینه سازی و سئوی سایت روی لینک زیر کلیک کن و تو دوره ثبت نام کن:
دوره آموزش سئو محتوا کاملا حرفه ای براساس آخرین آپدیت های گوگل
پیوندهای مهم و کاربردی
تگ های جدید HTML5 در سایت آموزی
صفات تگ های HTML در سایت آموزی
تگ های منسوخ شده HTML5 در سایت آموزی
معرفی و کاربرد تگ video در HTML درج ویدئو سند html – اختصاصی سایت آموزی
درباره سایت آموزی
علیرضا ابراهیمی - بنیانگذار وبسایت آموزشی سایت آموزی ، 8 سال سابقه فعالیت حرفه ای در زمینه طراحی سایت ، سئو ، سابقه تدریس اغلب زبان های برنامه نویسی تحت وب ، محقق و تحلیلگر ساختارهای توسعه دهنده وب
نوشته های بیشتر از سایت آموزی
دیدگاهتان را بنویسید