‎‎تگ ويدئوHTML <video> Tag -‎

Previous >    <Next  

‎‎مثال ـ پخش يك ويدئو

<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> 

--(go to editor for change code and run)

‎‎تعريف وكاربردDefinition and Usage -‎

‎تگ‎<video>‎ براي جاسازي يك كليپ، فيلم ويا سايرموارد ويدئوئي در سند HTML ‎استفاده ميشود.

‎تگ فوق شامل يك يا چند تگ‎<source>‎ كه معرف منابع مختلف ويدئوئي هستند، ميشود . ‎مرورگر اولين منبع كه قابل قبولش باشد، انتخاب مي نمايد.

‎متني مابين‎<video>‎ و ‎</video>‎ معرفي ميشود ،كه ‎در صورت عدم پشتيباني مرورگراز عنصر‎<video>‎ نمايش داده ميشود.

‎درHTML سه فرمت ويدئوئي MP4, WebM و OGGپشتيباني ميشود .جدول پشتيباني مرورگرها ازآن ‎مطابق زيراست.

‎browser‎ ‎MP4‎ ‎WebM‎ ‎Ogg‎
‎Edge‎ ‎YES‎ ‎YES‎ ‎YES‎
‎Chrome‎ ‎YES‎ ‎YES‎ ‎YES‎
‎Firefox‎ ‎YES‎ ‎YES‎ ‎YES‎
‎Safari‎ ‎YES‎ ‎YES‎ ‎NO‎
‎Opera‎ ‎YES‎ ‎YES‎ ‎YES‎

‎نكته ـ براي فايلهايaudio به تگ <audio> ‎توجه كنيد.

‎‎پشتيباني مرورگرBrowser Support -‎

‎‎در جدول زير اعداد نشان دهنده اولين نسخه مرورگراست كه از تگ فوق بطور كامل پشتيباني مينمايد

‎Element‎ Chorome Edge Firefox Safari Opera
‎‎<video>‎‎ ‎‎4.0‎ ‎‎9.0‎ ‎‎3.5‎ ‎‎3.1‎ ‎‎11.5‎

‎‎ويژگي هاي اختياريOptional Attributes -‎

‎‎ويژگي ‎‎مقدار ‎‎شــرح
‎autoplay‎ autoplay‎‎ ‎‎مشخص ميكند كه بمحض آماده شدن ويدئو، پخش شود.
‎controls‎ controls‎‎ ‎‎مشخصرميكند كه بايد كنترل هاي ويدئو مثلplay/pause وغيره ظاهر شود .
‎height‎ pixels‎‎ ‎‎تنظيم ارتفاع ويدئو
‎loop‎ loop‎‎ ‎‎پخش مجدد ويدئو را مشخص ميكند.
‎muted‎ miuted‎‎ ‎‎صدا قطع ميشود، يا پخش خاموش
‎poster‎ URL‎‎ ‎‎آدرسURL تصوير كه بايد نمايش داده شود مشخص ميكند .
‎preload‎ auto
metadata
none
‎‎
‎‎نحوي بارگذاري ويدئو را در هنگام بارگذاري صفحه مشخص ميكند.
‎src‎ URL‎‎ ‎‎ادرسURL فايل ويدئو را مشخص ميكند .
‎width‎ pixels‎‎ ‎‎عرض پخش كننده را تنظيم ميكند.

‎‎ويژگي هاي جهانيGlobal Attributes -‎

‎‎تگ‎<video>‎ از ويژگي هاي جهانيHTML پيروي ميكند. …

‎‎ويژگي هاي رويداديEvent Attributes -‎

‎‎تگ فوق همچنين از ويژگي هاي رويدادي پيروي ميكند.

‎‎تنظيمات پيش فرضDefault CSS Settings -‎

‎‎نــدارد.

‎مرجع كامل تگهايHTML
‎مرجع كامل ويژگيهايHTML


Previous >    <Next