Video and audio tag html in hindi
यदि आप एचटीएमएल5 वेब पेज में मल्टीमीडिया फीचर्स को इन्सर्ट या एम्बेड करना चाहते है. तो आप एचटीएमएल5 <video> और <audio> टैग का उपयोग करके वेबपेज में वीडियो और ऑडियो मल्टीमीडिया ऑब्जेक्ट को डायरेक्ट एम्बेड कर सकते है। वीडियो और ऑडियो एचटीएमएल वेब पेज में ऑडियो और वीडियो टैग से डायरेक्ट वेब पेज में मल्टीमीडिया ऑब्जेक्ट को ऐड कर सकते है।
Use of video and audio tags in HTML5 web page.
HTML <video> tag.
एचटीएमएल वेब पेज में <video> टैग का उपयोग करके डिजायर वेबपेज में वीडियो मल्टीमीडिया ऑब्जेक्ट को एम्बेड किया जाता है। यहाँ एम्बेड वीडियो लोकल ऑफलाइन और ऑनलाइन वीडियो यूआरएल सोर्स लिंक पाथ हो सकता है.
Video tag basic syntax.
<video src=”videoname.mp4″ controls width=”400″ height=”240″>
if video not start, your web browser not compatible
</video>
Video tag main features.
Video src – वीडियो src ऐट्रिब्यूट्स एचटीएमएल वेब पेज में इन्सर्ट होने वाले वीडियो सोर्स लोकेशन को डिफाइन करता है। यहाँ आप ऑनलाइन और ऑफलाइन वीडियो ऑब्जेक्ट सोर्स पाथ लोकेशन को ऐड कर सकते है.
Video src attributes Example.
<video src=”moviename.mp4″ controls></video>
Video controls – डिजायर एचटीएमएल वेब पेज में वीडियो मल्टीमीडिया कण्ट्रोल ऐट्रिब्यूट्स को प्ले होने वाले वीडियो प्लेयर में वीडियो प्लेबैक कण्ट्रोल में (प्ले, पॉज़, वॉल्यूम) जैसे मल्टीमीडिया कण्ट्रोल को ब्राउज़र में डिस्प्ले करता है।
Video controls Example.
<video src=”videoname.mkv” controls></video>
Video width and height – वेब डेवलपर वीडियो विड्थ एंड हाइट ऐट्रिब्यूट्स से वेब पेज में डिस्प्ले होने वाले वीडियो की हाइट और विड्थ को प्ले होने वाले वीडियो प्लेयर में वीडियो डायमेंशन को अपनी जरूरत के अनुसार डिफाइन करता है।
Video width and height Example.
<video src=”videoname.mp4″ controls width=”300″ height=”300″></video>
Video Autoplay Features – यदि आप अपने वेब पेज में लोड होने पर वीडियो को आटोमेटिक रूप से सेट कर सकते है, जिससे वीडियो वेब ब्राउज़र में आटोमेटिक स्टार्ट हो जाएगा। डिफ़ॉल्ट ये फीचर्स वीडियो में टर्न ऑफ होता है.
Video Autoplay Features Example.
<video src=”videoname.mp4″ autoplay></video>
Video Loop – मौजूदा वेब पेज में प्ले होने वाले वीडियो फाइल को लूप करना चाहते है, तो यह प्रॉपर्टीज प्ले वीडियो के समाप्त होने पर अपने आप फिर से आटोमेटिक स्टार्ट या बार बार लूप कर देती है.
Video Loop Example.
<video src=”videoname.mp4″ loop></video>
Video Mute – यदि आप अपने डिजायर वीडियो को म्यूट प्रॉपर्टीज के साथ वेब ब्राउज़र में डिस्प्ले करना चाहते है, तो आप वीडियो म्यूट प्रॉपर्टीज को उपयोग कर सकते है.
Video Mute Example.
<video src=”videoname.mp4″ muted></video>
Video Poster – यदि आप अपने वेब ब्राउज़र में डिस्प्ले होने वाले वीडियो के शुरू में इमेज या पोस्टर डिस्प्ले करना चाहते है, तो आप वीडियो पोस्टर ऐट्रिब्यूट्स को उपयोग कर सकते है।
Video poster example.
<video src=”videoname.mp4″ controls poster=”movieposter.jpg”></video>
Video <source> elements.
आप अपने एचटीएमएल वेब पेज में कई वीडियो फॉर्मेट को ऐड कर इंडिविजुअल डिस्प्ले कर सकते है, मौजूदा समय में कई पॉपुलर वीडियो फॉर्मेट जैसे, flv, mp4, mkv, avi, mov, wmv, webm, आदि वीडियो फॉर्मेट को ऐड और प्ले कर सकते है.
<video controls width=”300″ height=”300″>
<source src=”video1.mp4″ type=”video/mp4″>
<source src=”video2.flv” type=”video/flv”>
<source src=”video3.mov” type=”video/mov”>
<source src=”video4.webm” type=”video/webm”>
if video not preview, your web browser not compatible to preview
</video>
Html web page video tag example
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title> Html Video Tag </title>
</head>
<body>
<h2>Let Tray Some Video In Html Web Page</h2>
<video controls width=”400″ height=”300″ poster=”movieposter.jpg”>
<source src=”https://cdn.pixabay.com/video/2024/06/17/217115_large.mp4″ type=”video/mp4″>
if video file not display, your web browser is too old.
</video>
</body>
</html>
<audio> tag.
यदि आप अपने वेब पेज में ऑडियो फाइल को ऐड कर डिस्प्ले करना चाहते है. तो आप एचटीएमएल वेब पेज में <audio> टैग का उपयोग करके डिजायर ऑडियो फाइल एक्सटेंशन को ऐड कर वेब ब्राउज़र में प्रीव्यू कर सकते।
Audio tag basic syntax.
<audio src=”audioname.mp3″ controls>
if audio file not preview, your web browser is too old
</audio>
Audio tag main attributes.
Audio src – अपने वेब पेज में ऐड होने वाले ऑडियो फ़ाइल का सोर्स लोकेशन डिफाइन कर सकते है। यहाँ पर आपका ऑडियो फाइल सोर्स लोकेशन ऑनलाइन वेब सर्वर या लोकल कंप्यूटर ऑफलाइन स्टोरेज पाथ भी हो सकता है.
Audio src attributes example.
<audio src=”audioname.mp3″ controls></audio>
Audio controls – वेब पेज में प्ले होने वाले ऑडियो फाइल के ऑडियो प्लेयर में ऑडियो प्लेबैक कंट्रोल्स जैसे (प्ले, पॉज़, वॉल्यूम) फीचर्स को प्रीव्यू करता है।
Audio controls example.
<audio src=”audioname.mp3″ controls></audio>
Audio autoplay – डिजायर वेब पेज में प्ले होने वाले ऑडियो के वेब पेज में लोड होने पर ऑडियो को ऑटोप्ले ऐट्रिब्यूट्स के साथ सेट कर सकते है, जिससे वेब पेज प्रीव्यू करते ही ये ऑडियो फाइल आटोमेटिक प्ले हो जाएगी। डिफ़ॉल्ट ये ऑडियो प्रॉपर्टीज टर्न ऑफ होती है.
Audio autoplay Example.
<audio src=”audioname.mp3″ autoplay></audio>
Audio loop – ये ऑडियो प्रॉपर्टीज आपके ऑडियो फाइल को लूप कर देता है, जिससे ऑडियो फाइल टर्मिनेट होते आटोमेटिक प्ले होती रहेगी।
Audio loop attributes Example.
<audio src=”audioname.mp3″ loop></audio>
Audio muted – यदि आप प्रीव्यू ऑडियो फाइल को वेब ब्राउज़र में प्रीव्यू टाइम म्यूट करना चाहते है, तो आप ऑडियो म्यूट ऐट्रिब्यूट्स को उपयोग कर सकते है ।
Audio muted attributes Example.
<audio src=”audioname.mp3″ muted></audio>
Using audio <source> elements.
आप अपने वेब ब्राउज़र में वेबसाइट जरूरत के अनुसार कई प्रकार के ऑडियो फाइल एक्सटेंशन को ऐड कर डिस्प्ले कर सकते है, जैसे, mp3, ogg, wav, आदि है.
<audio controls>
<source src=”audio1.mp3″ type=”audio/mp3″>
<source src=”audio2.wav” type=”audio/wav”>
<source src=”audio3.flac” type=”audio/flac”>
<source src=”audio4.ogg” type=”audio/ogg”>
if audio file not preview, your web browser is not compatible
</audio>
Html audio tag example
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title>Html Audio Tag</title>
</head>
<body>
<h2>Let Tray Some Audio file</h2>
<audio controls>
<source src=”audioname.mp3″ type=”audio/mpeg”>
if audio file not display, your web browser is too old.
</audio>
</body>
</html>