embed 插入视频、插入声音audio、插入视频video

最新推荐文章于 2023-01-03 12:23:12 发布

潜龙卧湖

最新推荐文章于 2023-01-03 12:23:12 发布

阅读量1.7w

点赞数

分类专栏： html+html5 文章标签： html html5

本文链接：https://blog.csdn.net/weixin_44046450/article/details/107738907

版权

html+html5 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

本文介绍了HTML5中embed用于插入视频，audio用于插入声音，以及video标签用于插入视频的方法，通过代码演示展示了它们的使用效果。

摘要由CSDN通过智能技术生成

embed 插入视频、插入声音audio、插入视频video

1、embed 插入视频
代码演示：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
    </head>
    <body>
    <embed src='http://player.youku.com/player.php/sid/XMjg3MzI1MTUzNg==/v.swf' allowFullScreen='true' quality='high' width='480' height='400' align='middle' allowScriptAccess='always' type='application/x-shockwave-flash'></embed>
    </body>
</html>

效果无
2、插入声音audio
代码演示：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
    </head>
    <body>
<!--     <audio src="bgsound.mp3"  autoplay="autoplay"  controls loop="-1"/></audio>   -->
    为了浏览器兼容， 我们需要做三种声音文件 ogg mp3  wav
    <audio controls autoplay>
    	<source  src="bgsound.mp3" />
    	<source  src="music.ogg" />
    	您的浏览器不支持播放声音
    </audio>
    </body>
</html>

效果演示：
在这里插入图片描述
3、插入视频video
代码演示：

<html lang="en">
    <head>
        <meta charset="utf-8">
    </head>
    <body>
    <!-- <video src="mp4.mp4" autoplay controls></video> -->
    我们的视频支持  ogg  mp4  webM 三种视频格式
    <video controls autoplay>
    	<source src="mp4.mp4"/>
    	<source src="movie04.ogg"/>
    	您的浏览器不支持视频播放
    </video>
    </body>
</html>

效果演示：
在这里插入图片描述