HTML5: Audio, video and other multimedia

• Video file format

HTML5 supports three video file formats (that is, codecs):. ogg. mp4 or. m4v. WebM. A codec is a computer program that encodes and decodes a digital stream of data using a compression algorithm to make it more suitable for playback. In some browsers, if the MIME type is not set correctly, the media file will not play.

To get support for media playback for all compatible HTML5 browsers, you need to provide at least two video formats: MP4 and WEBM.

Add the following text to the suffix named. htaccess (or other) file to set the MIME type:

AddType Video/ogg. OGV

AddType video/mp4. mp4

AddType VIDEO/WEBM. webm

AddType Audio/ogg. ogg

AddType Audio/mp3. mp3

• Add a single video

<video src= "" Width= "" heigth= "" AutoPlay muted controls loop poster preload> </video>

Property Description:

AutoPlay-Auto Play

Muted--whether mute play

Controls-Add the default controls that your browser sets for your video

Poster--URL value that specifies the image to be displayed when the video is loaded (without displaying the first frame of the video)

Preload--tells the browser how much video content to load. None---No value is loaded, metadata means that only the metadata of the video is loaded, and auto means letting the browser decide what to do.

• Specify multiple sources for a media file to ensure support for all browsers

Implemented through the source element, multiple source elements can be added to the Videl tag to specify the source of the media file

　　　　

<Videocontrols muted autoplay preload= "None"Loop>    <Sourcesrc= "Mp4filesource.mp4">    <Sourcesrc= "WEBMFILESOURCE.WEBM">   <P><ahref="">The old browser displays the text in the P element</a></P></Video>

The attributes of the source element are:

Type: Used to specify the kind of video, which helps the browser decide whether it can play the video

Media: Use to specify CSS3 media queries for video sources, allowing you to specify different video playback for devices of different screen sizes.

• Audio file format

The usual is OGG and MP3.

1) Add an audio file in a single format

<auto src= "" AutoPlay controls Loop muted preload>

2) Add multiple formats of audio files

Like a video file, use the source element

<audio>

<source src= "" type= "" Media= "" >

</audio>

　　

HTML5: Audio, video and other multimedia