HTML5 <video> تدعم العلامة 3 تنسيقات فيديو شائعة الاستخدام:
1. OGG = ملف OGG مع ترميز الفيديو الخاص بـ Theora وترميز صوت Vorbis ؛
2. MPEG4 = ملف mpeg 4 مع ترميز الفيديو H.264 وترميز الصوت AAC ؛
3. webm = ملف webm مع ترميز الفيديو VP8 وترميز صوت Vorbis.
في الوقت الحاضر ، يتمتع المتصفحات الرئيسية بدعم مختلف لتنسيقات الفيديو. أعتقد أن اليوم الذي تم إصداره رسميًا في HTML5 سيدعم المزيد من تنسيقات الفيديو ، مما يجلب العديد من الفوائد للمطورين والمستخدمين.
دعنا نتحدث عن استخدام مقاطع فيديو علامات الفيديو HTML5. إذا كنت بحاجة إلى عرض مقاطع فيديو في المتصفح ، فكل ما تحتاجه هو نسخ الرمز التالي:
<video src = movie.ogg عرض = 320 ارتفاع = 240 عناصر التحكم = عناصر التحكم>
لا يدعم متصفحك علامة الفيديو.
</video>
خصائص التحكم في إضافة عناصر التحكم في اللعب ، وقفة ، وحجم عناصر التحكم. من الجيد أيضًا تضمين عرض العرض وخصائص الارتفاع. يتم عرض المحتوى الذي تم إدخاله بين <video> و </video> بواسطة المتصفحات التي لا تدعم عناصر الفيديو.
يستخدم الرمز أعلاه ملف OGG يعمل مع Firefox و Opera و Google Chrome. للتأكد من أنه مناسب لمتصفح Safari ، يجب أن يكون ملف الفيديو بتنسيق MPEG4. لا يدعم IE8 علامات HTML5 <Video> ، ويدعم IE9 هذه العلامة ، ولكن يجب أيضًا استخدام تنسيق MPEG4.
يسمح عنصر الفيديو عناصر مصدر متعددة. يمكن لعنصر المصدر ربط ملفات الفيديو بتنسيقات مختلفة. يكتشف المتصفح ويستخدم أول تنسيق يمكن التعرف عليه ، والرمز هو كما يلي:
<عرض الفيديو = 320 ارتفاع = 240 عناصر التحكم = عناصر التحكم>
<المصدر src = movie.ogg type = video/ogg>
<المصدر src = movie.mp4 type = video/mp4>
لا يدعم متصفحك علامة الفيديو.
</video>
فيما يلي الخصائص الشائعة لعلامة <video>:
| ملكية | قيمة | يصف |
اللعب التلقائي | اللعب التلقائي | إذا ظهرت هذه الخاصية ، فسيتم تشغيل الفيديو فور استعداده. |
الضوابط | الضوابط | إذا ظهرت هذه الخاصية ، يتم عرض عنصر تحكم للمستخدم ، مثل زر التشغيل. |
ارتفاع | بكسل | اضبط ارتفاع مشغل الفيديو. |
حلقة | حلقة | إذا ظهرت هذه الخاصية ، يبدأ التشغيل مرة أخرى عندما ينتهي ملف الوسائط. |
التحميل المسبق | التحميل المسبق | إذا ظهرت هذه الخاصية ، يتم تحميل الفيديو عند تحميل الصفحة وجاهزة للتشغيل. إذا تم استخدام Autoplay ، يتم تجاهل هذه الخاصية. |
SRC | عنوان URL | عنوان URL للفيديو للتشغيل. |
عرض | بكسل | يضبط عرض مشغل الفيديو. |
أدى ظهور فيديو علامة الفيديو HTML5 إلى تحسين تجربة المستخدم على الويب بشكل كبير وسيجعله أكثر ملاءمة للمستخدمين للتصفح والاستخدام.