Table of Contents
audio support for audio
The following is the running effect of my sample code, both audio and video are played!
Home Web Front-end H5 Tutorial Detailed introduction to HTML5 multimedia audio and video (1)

Detailed introduction to HTML5 multimedia audio and video (1)

May 19, 2017 pm 04:57 PM

Usually browsers install flash to play audio and video on web pages.
HTML5 adds audio and video elements for audio and video playback, thereby reducing dependence on flash.

audio support for audio

HTML5 specifies a standard way to include audio through the audio element.
Currently the audio element supports the following three audio formats:

##Ogg VorbisNOYESYESYESNOMP3YES NONOYESYESWavNOYESYESNOYES
Audio format IE9 Firefox 3.5 Opera 10.5 Chrome 3.0 Safari 3.0
video support for video

HTML5 provides a A standard way to include video via the video element.

Currently the video element supports the following three video formats:

FormatIEFirefoxOpera ChromeSafariOggNo3.5+10.5+5.0+No##MPEG 4WebM##audio and video playback audio and video examples
<!Doctype html>
<html>
<head>
<title>HTML5多媒体</title>
<meta charset="utf-8"/>
</head>
<body>
    <p>
        <audio id="myAudio" controls="controls">
            <source src="resource/传奇.mp3" type="audio/mpeg">
            您的浏览器不支持audio        
            </audio>
    </p>

    <p>
        <video id="myVideo" controls="controls">
            <source src="resource/手语.mp4" type="video/mp4">
            您的浏览器不支持video        
            </video>
    </p>
    </body>
    </html>
Copy after login
9.0+ No No 5.0+ 3.0+
No 4.0 + 10.6+ 6.0+ No
The above is the simplest sample code for playing audio and video. Of course, you have to find the mp3 and mp4 resource files yourself~

The following is the running effect of my sample code, both audio and video are played!



[Related recommendations]Detailed introduction to HTML5 multimedia audio and video (1)

1.

Detailed explanation of the video tag test application of html5

2. html 5 Use the video element to create a video player

3. Share the problem and solution of a video tag that cannot play mp4

4. H5 The solution to the video tag that can only play sound but not video

5. The MIME type of IIS is not registered as the MP4 type, resulting in the inability to recognize the vidoe tag.

The above is the detailed content of Detailed introduction to HTML5 multimedia audio and video (1). For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Table Border in HTML Table Border in HTML Sep 04, 2024 pm 04:49 PM

Guide to Table Border in HTML. Here we discuss multiple ways for defining table-border with examples of the Table Border in HTML.

HTML margin-left HTML margin-left Sep 04, 2024 pm 04:48 PM

Guide to HTML margin-left. Here we discuss a brief overview on HTML margin-left and its Examples along with its Code Implementation.

Nested Table in HTML Nested Table in HTML Sep 04, 2024 pm 04:49 PM

This is a guide to Nested Table in HTML. Here we discuss how to create a table within the table along with the respective examples.

HTML Table Layout HTML Table Layout Sep 04, 2024 pm 04:54 PM

Guide to HTML Table Layout. Here we discuss the Values of HTML Table Layout along with the examples and outputs n detail.

Klipsch unveils Flexus Core 300 flagship soundbar with 8K support, 12 speakers and room correction Klipsch unveils Flexus Core 300 flagship soundbar with 8K support, 12 speakers and room correction Sep 05, 2024 am 10:16 AM

The Klipsch Flexus Core 300 is the top model in the series and is positioned above the already available Flexus Core 200 in the company's soundbar line-up. According to Klipsch, this is the first soundbar in the world whose sound can be adapted to th

HTML Input Placeholder HTML Input Placeholder Sep 04, 2024 pm 04:54 PM

Guide to HTML Input Placeholder. Here we discuss the Examples of HTML Input Placeholder along with the codes and outputs.

Moving Text in HTML Moving Text in HTML Sep 04, 2024 pm 04:45 PM

Guide to Moving Text in HTML. Here we discuss an introduction, how marquee tag work with syntax and examples to implement.

HTML Ordered List HTML Ordered List Sep 04, 2024 pm 04:43 PM

Guide to the HTML Ordered List. Here we also discuss introduction of HTML Ordered list and types along with their example respectively

See all articles