Connect with us

tech help

▷how to insert video in html5 using notepad हिंदी।

how to insert video in html- how to add video in banner html- how to add video in html code- how to add a video in html page- how to add video link in html

हेलो दोस्तों हम आपका अभिनंदन करते है। जैसा की हमारे पाठ के शीर्षक में आपने पढ़ा तो आप ये जानकारी प्राप्त करना चाहते है। how to insert video in html using notepad तो आपकी जानकारी आपको आसान और सरल भाषा में प्रदान करने का प्रयाश करेंगे। हम आपको html file में video insert करने के साथ साथ उसके attribute के बारे में भी जानकारी प्रदान करने वाले है।

steps information

Most information about how to insert video in html
<video> tag attribute list
use of attribute
video add in html file
youtube video add in html file

Most information about how to insert video in html

सबसे मुख्य परेशानी ये होती है। की हम <video> tag ( html all tag ) का उपयोग करते है। लेकिन फिर हम अपनी pc या कम्प्यूटर के video को html फाइल में जोड़ नहीं पाते है। हालाँकि हम कोई गलती भी नहीं करते है। हम उसी प्रकार video tag उपयोग करते है। जैसा की हमे w3school जैसी वेबसाइट में बताया जाता है। लेकिन आज हम आपको बताएंगे। कोनसी गलती हम से हो जाती है। जिसके कारण हम वीडियो को जोड़ नहीं पाते है। आपकी इस परेशानी का उत्तर तो आपको मिलेगा। साथ ही हम आपको बताते है। की <video> tag के साथ कोनसे attribute उपयोग किये जाते है। और उनका उपयोग क्या होता है। किस प्रकार उनको लिखना है। तो चलिए जानते है।

<video> tag attribute list

  • poster
  • autoplay
  • autoplay loop
  • controls
  • type
  • width
  • hight
  • source 

use of attribute

poster attribute = इसका उपयोग वीडियो के ऊपर [banner ] पोटस्टर लगाने के लिए किया जाता है।
autoplay attribute= इसका उपयोग उस समय किया जाता है। जब हम चाहते हो की जब भी हमारा html page खुले तो video बिना किसी निर्देश के खुद ही play हो जाये।

note : autoplay  कुछ डिवाइस में कार्य नहीं करता है।

autoplay loop attribute= इसका उपयोग उस समय किया जाता है। जब हम चाहते हो की हमारा वीडियो बिना किसी निर्देश के बार बार play होता रहे।
controls attribute = इसका उपयोग करना अनिवार्य होता है। इसका उपयोग करने के बाद ही हम वीडियो को प्ले कर पाते है। ध्वनि को नियंत्रित्त कर पाते है। स्क्रीन का आकर बदल सकते है।
type attribute = इसका उपयोग हम इसलिए करते है। ताकि हम ब्रौज़र को बता पाए की हमारी फ़ाइल कोनसे फॉर्मेट की है।
source attribute = इसका उपयोग करके हम अपनी फ़ाइल का स्थान निर्धारित कर ब्रौज़र को करते है। ताकि फाइल को खोज कर दिखाया जा सके। इसके लिए लिंक का उपयोग किया जाता है।
width and width attribute = इसका उपयोग हम अपनी वीडियो के आकर को छोटा या बड़ा करने के लिए उपयोग करते है। यानिकि लम्बाई और चौड़ाई को निर्धारित करते है।

video add in html file

अगर हम अपने html फाइल में किसी video को जोड़ना चाहते है। तो हमें कुछ इस प्रकार html code लिखना होता है।

try code

<!DOCTYPE html>
<html>
<body>
  <video width="500px" controls autoplay loop>
    <source src="newvideo.mp4" type="video/mp4">
    Your browser does not support the video tag.
  </video>
</body>
</html>

जैसा की आप देख सकते है। की हमने यह कोड लिखा है। इसमें हमने <source src=”newvideo.mp4″ type=”video/mp4″> लिखा है। हालाँकि यह रूल सही होता है। वीडियो को जोड़ने के लिए लेकिन बहुत सी बार लोगो को इसमें परेशानी होती है। उनका वीडियो html file में add नहीं हो पाता है। लेकिन हम आपको इसके बारे में भी जानकारी देते है।

अगर आपका वीडियो इस मेथड से add नहीं हो पाता है। तो आपको अपने laptop या कम्प्यूटर के उस फोल्डर में जाना है। जहा आपका वीडियो मौजूद है।

how to insert video in html- how to add video in banner html- how to add video in html code- how to add a video in html page- how to add video link in html

जैसा की आप इस इमेज में देख सकते है। आपको कुछ इस प्रकार C:\Users\HP\Desktop\quote fale लिखा हुआ फाइल पाथ दिखाई दे रहा है। आपको केवल इस पाथ के आगे कुछ इस प्रकार \ स्लेश का उपयोग करना है। जैसे आप इसको लिखते है। तो आपके सामने इस उस फोल्डर सभी फाइल के लिंक कुछ इस प्रकार दिखाई देंगे।

how to insert video in html- how to add video in banner html- how to add video in html code- how to add a video in html page- how to add video link in html

इसमें आपको अपनी वीडियो लिंक सलेक्ट करना copy करके आप इस प्रकार <source src=”C:\Users\HP\Desktop\quote fale\newvideo.mp4″ type=”video/mp4″> जोड़ सकते है। जैसा की आप इस कोड में देख सकते है। इसमें आप देख सकते है। की हमने इसमें banner और video को जुड़ा है। साथ अन्य attribute का उपयोग भी किया है।

try code

<!DOCTYPE html>
<html>
<body>
  <video width="200px" poster="C:\Users\HP\Desktop\quote fale\How To Button Align Center-compressed.jpg" controls
    autoplay loop>
    <source src="C:\Users\HP\Desktop\quote fale\newvideo.mp4" type="video/mp4">
    Your browser does not support the video tag.
  </video>
  <p><b>Note:</b> The autoplay attribute does not work on some mobile devices.</p>
</body>
</html>

आप इन दोनों प्रकार से video को को html file में जोड़ सकते है।

youtube video add in html file

अब हम जानते है। की हम कैसे यूट्यूब की वीडियो को अपनी html file जोड़ सकते है। यूट्यूब की video को जोड़ने के लिए आपको उस video play करना होगा। जैसे ही आप उस video play करते है तो आपको video के निचे एक share button दिखाई देता है। आप उस button को क्लीक करते है। तो आपके सामने कुछ इस प्रकार के कुछ ओप्सन दिखाई देंगे।

how to insert video in html- how to add video in banner html- how to add video in html code- how to add a video in html page- how to add video link in html

जैसे आप के सामने इस प्रकार से ऑप्शन दिखाई दे तो आपको <embed> को क्लीक करना है। embed को क्लीक करते ही आपके सामने कुछ इस प्रकार से code दिखाई देगा।

how to insert video in html- how to add video in banner html- how to add video in html code- how to add a video in html page- how to add video link in html

आपको इस code को copy करके अपने html file में कुछ इस प्रकार past सकते है।

try code

<!DOCTYPE html>
<html>
<body>
  <iframe width="560" height="315" src="https://www.youtube.com/embed/Lcirdn0-t-c" frameborder="0"
    allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
    allowfullscreen></iframe>
</body>
</html>

आप इस प्रकार किसी video को html file में जोड़ सकते है। अगर आपका कोई सवाल या सुझाव हो तो हमे कमेंट के माध्यम से से सूचित कर सकते है।

read more

▷How To Button Align Center Css

▷html form with code in hindi

▷How To Create Table In Html In हिंदी

Information Source: w3school

Click to comment

Leave a Reply

tranding