Embed Multimedia Tags in html
Embed Multimedia Tags
Multimedia का मतलब कई रूपों को इकठ्ठा करना होता है |
Example, audio, video, animation, graphics, pictures, recordings, etc.
कुछ वक्त webpage पर audio या video file को embed करने की जरुरत पड़ती है |
Multimedia files के कुछ अलग-अलग formats होते है |
For Example, .mp3, .mp4, .avi, .flv, .swf, .mkv, .ogg, .mpg, .mpeg, .mov, .aac
HTML Page पर कुछ multimedia files को embed करने के लिए कुछ elements का इस्तेमाल किया जाता है जो निम्न है
<audio>
<video>
<source>
<embed>
<object>
<picture>
<audio> Element
<audio> Element से सामान्य तरीके से audio को अपने webpage पर embed किया जाता है |
<audio> element के controls attribute का इस्तेमाल audio को control करने के लिए किया जाता है |
|
Attributes |
Description |
|
src |
इस attribute के द्वारा आप audio file का address define करते है। |
|
autoplay |
इस attribute से आप audio file को load होते ही automatically play होने के लिए set कर सकते है। |
|
controls |
ये attribute बताता ही की audio file के साथ कौनसे controls show होंगे। |
|
loop |
इस attribute के द्वारा define किया जाता है की audio file repeat होगी या नहीं। इस attribute की true और false 2 values होती है। |
|
muted |
इस attribute के द्वारा ये define किया जाता है की audio file जब load होगी तो वह mute होगी। |
|
preload |
ये attribute define करता है की audio file कैसे और कब load होनी चाहिए। |
Example
<html>
<head>
<title>audio tag example</title>
</head>
<body>
<h1> My favorite song </h1>
<audio src="media/Audio/example/mp3" controls="controls">
</audio>
</body>
</html>
<video> Element
<video> Element से सामान्य तरीके से video को अपने webpage पर embed किया जाता है |
<video> element के controls attribute का इस्तेमाल video को control करने के लिए किया जाता है |
Example
<html>
<head>
<title>video tag example</title>
</head>
<body>
<video src="media/video/example.mp4" controls="controls">
</video>
</body>
</html>
<source> Element
<source> Element ये <audio>, <video> और <picture> element का child element होता है |
<source> Element का इस्तेमाल <audio>, <video> और <picture> element पर एक या उससे ज्यादा multimedia files को embed करने के लिए किया जाता है |
Attributes of HTML5 <source> Tag
· src - जब आप <source> tag को video और audio tags के साथ use करते है तो यह attribute media resources की location define करने के लिए use किया जाता है।
· srcset - जब आप <source> tag को <picture> tag के साथ use करते है तो यह attribute image का URL define करने के लिए use किया जाता है।
· media - इस attribute के द्वारा आप वे media queries define कर सकते है जो आप normally CSS के द्वारा define करते है।
· sizes - इस attribute के द्वारा आप अलग अलग layouts के लिए अलग अलग image sizes define कर सकते है।
· type - यह attribute media resource का MIME type define करने के लिए use किया जाता है।
Example
<html>
<head>
<title>Source Tag Demo</title>
</head>
<body>
<video controls>
<source src="videos/example.mp4">
<source src="videos/example.flv">
</video>
</body>
</html>
<embed> Element
<embed> element non-HTML external application या interactive content को HTML Webpage पर embed करने के लिए इस्तेमाल किया जाता है |
<embed> element को अलग से closing element नहीं होता है |
HTML5 <embed> Tag Attributes
|
Attributes |
Description |
|
src |
इस attribute के द्वारा आप उस file का address देते है जिसे आप webpage में include करना चाहते है। |
|
height |
इस attribute द्वारा create किये गए panel की height define की जाती है। |
|
width |
ये attribute create किये गए panel की width define करता है। |
|
type |
इस attribute से आप include की गयी file का type define कर सकते है। |
Example
<html>
<head>
<title> embed tag example</title>
</head>
<body>
<h1>My favorite song</h1>
<embed src="/media/video/myFile" height="300" width="300">
</body>
</html>
HTML5 <noembed> Tag
सभी browsers <embed> tag को support नहीं करते है। ऐसे browsers के लिए आप <noembed> tag यूज़ कर सकते है। इस tag को <embed> tag के अंदर यूज़ किया जाता है।
यदि किसी browser में <embed> tag support नहीं कर रहा है तो इस tag के द्वारा आप उस media file की जगह उस browser में कोई image show कर सकते है।
Example
<html>
<head>
<title>no embed tag example </title>
</head>
<body>
<embed src="/media/videos/myFile" height="" width="">
<noembed src="/media/images/myFile.jpg">
</embed>
</body>
</html>
Post a Comment