Home > Article > Web Front-end > How to insert video and audio in html

How to insert video and audio in html

王林forward: 2020-11-03 16:40:424402browse

Ideal solution for inserting videos:

HTML5 + <object> + <embed>

(Video tutorial recommendation: html video tutorial)

The code is as follows:

<!DOCTYPE html>
<html>
<body>

<video width="320" height="240" controls="controls" autoplay="autoplay">
  <source src="/i/movie.ogg" type="video/ogg" />
  <source src="/i/movie.mp4" type="video/mp4" />
  <source src="/i/movie.webm" type="video/webm" />
  <object data="/i/movie.mp4" width="320" height="240">
    <embed width="320" height="240" src="/i/movie.swf" />
  </object>
</video>

</body>
</html>

The ideal solution for inserting audio:

<embed>

The example below uses two different audio formats. The Html5 b97864c2e0ef2353a16c4d64c7734e92 element will attempt to play audio in mp3 or ogg. If that fails, the code will fall back to trying the d8e2720730be5ddc9c2a3782839e8eb6 element.

<!DOCTYPE HTML>
<html>
<body>

<audio controls="controls">
  <source src="/i/song.ogg" type="audio/ogg">
  <source src="/i/song.mp3" type="audio/mpeg">
<embed height="100" width="100" src="/i/song.mp3" />
</audio>

</body>
</html>

Related recommendations: html tutorial

The above is the detailed content of How to insert video and audio in html. For more information, please follow other related articles on the PHP Chinese website!

html5 html

Statement：

This article is reproduced at:csdn.net. If there is any infringement, please contact admin@php.cn delete

Previous article：Specific steps to use canvas to compress imagesNext article：Specific steps to use canvas to compress images

See more

How to insert video and audio in html

Related articles