Audio & Video HTML Element

Audio & Video HTML Element

1) Audio Tag(<audio>):-

This audio is like an image tag in the html. this tag is used to embed the sound in the html document. here also use of src attribute is there to give the path of source of the audio file to audio tag.

Attributes in the <audio> tag:-

  • autoplay-it is a Boolean attribute: if specified, the audio will automatically begin to play, without waiting for the entire audio file to finish downloading.

  • controls-it will provide the control feature to users when they add it to audio tag like controlling volume, playback speed, pause/resume.

  • loop-when it is used, after the end of audio again the audio will play from starting point.

  • muted-A Boolean attribute that indicates whether the audio will be initially silenced.

  • src- the url of audio to embed.

<audio controls>
  <source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>

Code output-

2) Video Tag(<video>):-

This tag is used to embed a media player in the document with some features. it will run your all videos in the document by embedding it. by using different attributes like audio tag we can use them here also. here we can give width and height to video frame so that it will look nice.

Attributes in the video tag:-

  • autoplay-it is a Boolean attribute: if specified, the video will automatically begin to play, without waiting for the entire video file to finish downloading.

  • controls-it will provide the control feature to users when they add it to video tag like controlling volume, playback speed, pause/resume.

  • loop-when it is used, after the end of the video again the video will play from starting point.

  • muted-A Boolean attribute that indicates whether the video will be initially silenced.

  • src- the url of video to embed.

  • height-The height of the video's display area, in css pixel not in percentage.

  • width-The width of the video's display area, in css pixel not in percentage.

      <video width="400" controls>
        <source src="mov_bbb.ogg" type="video/ogg">
      </video>
    

    Code output:-

Thanks for Reading..

Hitesh Choudhary Anurag Tiwari Hitesh Choudhary