《个人学习笔记八》
embed标记
使用embed标记,可以播放的文件类型有MiNi、Mav、AIFF、SWF、AV、MP3、MOV、AVI等
语法说明
- width 、
height:整型值单位为像素,设置宽度和高度会出现播放界面,否则不会出现播放界面。一些高版本浏览器不设置宽度和高度也会出现播放界面。如果播放音频作为背景音乐时,
必须同时将宽度和高度设置为0。 - src:设置媒体文件的路径。
- autostart:逻辑值。true为自动播放;false为不能自动播放。
- loop:逻辑值。规定音频或视频文件能否循环播放。属性值为true时,会循环。属性值为false时,不会循环播放。
- 参考代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>页面嵌入多媒体文件</title>
</head>
<body>
<h3>插入老薛的歌</h3>
<embed src="video/laoxue.mp3" width="300" height="150" autostart loop>
<embed src="video/mov_bbb.mp4" width="300" height="150" autostart loop>
</body>
</html>
表现结果如下:
audio标记
audio标签用来向页面中引入一个外部的音频文件
音视频引入时,默认情况下不允许用户自己控制播放停止
常用属性 | 作用 |
---|---|
controls | 是否允许用户控制播放 |
autoplay | 音频文件是否自动播放 |
loop | 音乐是否循环播放 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>页面嵌入多媒体文件</title>
</head>
<body>
<h3>插入老薛的歌</h3>
<audio src="video/laoxue.mp3" controls autoplay loop></audio>
</body>
</html>
显示结果:
重点:
除了通过src来指定外部文件的路径以外,还可以通过source来指定文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>页面嵌入多媒体文件</title>
</head>
<body>
<h3>插入老薛的歌</h3>
<!-- <audio src="video/laoxue.mp3" controls autoplay loop></audio> -->
<audio controls autoplay>
<source src="video/laoxue.mp3">
<source src="video/laoxue.ogg">
</audio>
<embed src="video/mov_bbb.mp4" type="video/mp4" width="300" height="150">
</body>
</html>
video
video标签用来向页面中引入一个外部的视频文件
视视频引入时,默认情况下不允许用户自己控制播放停止
常用属性 | 作用 |
---|---|
controls | 是否允许用户控制播放 |
autoplay | 视频文件是否自动播放 |
loop | 视乐是否循环播放 |
总而言之,audio和video两个标记属性很像,基本相同,了解了音频就相当于了解了视频。
来源:oschina
链接:https://my.oschina.net/u/4265014/blog/4683053