Skip to main content

HTML Video and Audio

Before HTML5, there was no standard for showing videos on a web page.
Before HTML5, videos could only be played with a plug-in (like flash).
The HTML5 <video> element specifies a standard way to embed a video in a web page.
To show a video in HTML, use the <video> element:
<video width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
The controls attribute adds video controls, like play, pause, and volume.
It is a good idea to always include width and height attributes.
If height and width are not set, the browser does not know the size of the video. The effect will be that the page will change (or flicker) while the video loads.
Text between the <video> and </video> tags will only display in browsers that do not support the <video> element.
Multiple <source> elements can link to different video files. The browser will use the first recognized format.
To start a video automatically use the autoplay attribute:

The HTML <audio> Element

To play an audio file in HTML, use the <audio> element:

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

Comments

Post a Comment

Popular posts from this blog

Basic Computer Shortcuts

Ctrl+C : Copies selected content. Ctrl+V : Pastes copied content Ctrl+X : Cut's selected content Ctrl+Z : undo the previous action Ctrl+Y : redo the action you undid Ctrl+A : Selects whole content Ctrl+P : print Windows Logo key( )+Down Arrow : Minimizes the window. Windows Logo key( )+Up Arrow : Maximizes the window. Windows Logo key( )+Left/Right Arrow : To compare two windows. While pressing the Windows logo key  , click the Right Arrow key or the Left Arrow key and your browser will slide over to one side. Select another window (such as a Word document) and use the shortcut only with the opposite arrow. Windows Logo key( )+L  : Locks your computer Windows Logo key( )+P : Presentation display mode Windows Logo key( )+Plus(+)/Minus(-)  : Zoom In and Zoom Out Windows Logo key( )+F : Search for a file Windows Logo key( )+F1 : help Ctrl+Shift+Esc : To open Task Manager
Post a Comment
Read more

HTML Tutorial Part 1

HTML - Hyper Text Markup Language which is used to create webpages. Common HTML Terms Elements or Tag An html element or a tag is similar to a command in programming language,here it defines the content or structure in a web page. Elements have to create by using a angle brackets. Example :  <html> <head> Tags most commonly occur in pairs of opening and closing tags. (<html> </html>) See the general structure of an html program. <html> <head> <title> Sample program</title> </head> <body> Actual body contents go here </body> </html> All html elements need to keep in between <html> </html> tags. <head> specifies the heading of html web page. <title> keep inside the <head> tag, the content in between <title>  and </title> would be the title displays on title bar of your browser. The page contents lies in between <body> and...
Post a Comment
Read more