در اين بخش از
دوره آموزش HTML در آموزش دون
، با تگ
<video> آشنا ميشويم. اين تگ براي **پخش ويديوها در صفحات وب** استفاده ميشود و امکاناتي
مانند کنترل پخش، صدا و زيرنويس را فراهم ميکند.
تگ video در HTML چيست؟
تگ <video> به مرورگر ميگويد که يک فايل ويديويي را در صفحه نمايش دهد.
ميتوان ويژگيهايي مانند controls، autoplay، loop و
muted به آن اضافه کرد تا تجربه کاربري بهتري ايجاد شود.
مثال ساده از تگ video
<video width="640" height="360" controls>
<source src="movie.mp4" type="video/mp4">
مرورگر شما ويديو را پشتيباني نميکند.
</video>در اين مثال، ويديو با عرض ??? و ارتفاع ??? پيکسل نمايش داده ميشود و کنترلهاي پخش براي کاربر فعال هستند.
ويژگيهاي مهم تگ video
| ويژگي | توضيح |
|---|---|
| controls | نمايش کنترلهاي پخش مانند play, pause, volume |
| autoplay | شروع خودکار پخش ويديو هنگام بارگذاري صفحه |
| loop | تکرار مداوم ويديو |
| muted | شروع ويديو با صداي خاموش |
| poster | تصوير پيشنمايش قبل از پخش ويديو |
مثال با زيرنويس و track
<video width="640" height="360" controls>
<source src="movie.mp4" type="video/mp4">
<track src="subtitles_fa.vtt" kind="subtitles" srclang="fa" label="فارسي">
مرورگر شما ويديو را پشتيباني نميکند.
</video>
با تگ <track> ميتوانيد زيرنويس به ويديو اضافه کنيد تا کاربران بتوانند زبان دلخواه خود را
انتخاب کنند.
نکات مهم درباره video
- هميشه منابع ويديو را با تگ
<source>مشخص کنيد تا مرورگرها پشتيباني بهتري داشته باشند. - براي بهبود تجربه کاربري، از ويژگيهاي
controlsوposterاستفاده کنيد. - ميتوانيد چندين فرمت ويديو اضافه کنيد تا تمامي مرورگرها بتوانند پخش کنند.
براي يادگيري کامل پخش رسانهها و مديريت ويديو در صفحات وب، پيشنهاد ميکنيم در دوره آموزش HTML و CSS آموزش دون شرکت کنيد.
براي مشاهده تمام آموزشهاي HTML، به صفحه اصلي آموزش دون مراجعه کنيد.
آموزش قبلي: تگ var در HTML
آموزش بعدي: تگ wbr در HTML5 پيشرفته
دیدگاه و پرسش