html5——多媒体（一）

<audio>

1、autoplay 自动播放

2、controls 是否显不默认播放控件

3、loop 循环播放

4、preload 预加载同时设置autoplay时些属性失效

5、由于版权等原因，不同的浏览器可支持播放的格式是不一样的

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--<audio src="music/yinyue.mp3" controls autoplay loop></audio>-->
<!--兼容写法-->
<audio controls loop autoplay>
    <source src="music/yinyue.mp3">
    <source src="music/yinyue.ogg">
    <source src="music/yinyue.wav">
    抱歉您的浏览器不支持
</audio>
</body>
</html>

<video>

1、autoplay 自动播放

2、controls 是否显示默认播放控件

3、loop 循环播放

4、preload 预加载，同时设置了autoplay，此属性将失效

5、width 设置播放窗口宽度

6、height 设置播放窗口的高度

7、由于版权等原因，不同的浏览器可支持播放的格式是不一样的

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
        body{
            text-align: center;
        }
        video{
            width: 1000px;
        }
    </style>
</head>
<body>
<!--<video src="video/movie.mp4" controls  autoplay ></video>-->
<!--  行内块 display:inline-block -->
<video controls autoplay>
    <source src="video/movie.mp4"/>
    <source src="video/movie.ogg"/>
    <source src="video/movie.webm"/>
    抱歉，浏览器要换了！
</video>
</body>
</html>