随着嵌入音频和视频元素在 Web 应用上的流行,大多数内容提供商会强迫使用 Flash 以便达到最佳 的跨浏览器兼容性。

    HTML5 新增了两个与媒体相关的元素,即

    ,从而为浏览器提 供了嵌入音频和视频的统一解决方案。

    1. <!-- 嵌入视频 -->
    2. <video src="conference.mpg" id="myVideo">视频加载失败</video>
    3. <!-- 嵌入音频 -->
    4. <audio src="song.mp3" id="myAudio">音频加载失败</audio>

    controls 属性如果存在,则表示浏览器应该显示播放界面,让用户可以直接控制媒体。

    由于浏览器支持的媒体格式不同,因此可以指定多个不同的媒体源。

    1. <!-- 嵌入视频 -->
    2. <video id="myVideo">
    3. <source src="conference.webm" type="video/webm; codecs='vp8, vorbis'">
    4. <source src="conference.ogv" type="video/ogg; codecs='theora, vorbis'">
    5. <source src="conference.mpg">
    6. Video player not available.
    7. </video>
    8. <!-- 嵌入音频 -->
    9. <audio id="myAudio">
    10. <source src="song.ogg" type="audio/ogg">
    11. <source src="song.mp3" type="audio/mpeg">
    12. Audio player not available.
    13. </audio>