使用HTML5在网页中嵌入音频和视频播放的基本方法_html5教程技巧
audio
html5
video
视频
音频
HTML5 特性,包括原生音频和视频支持而无需 Flash。
HTML5
嵌入视频
下面是在 Web 页面中嵌入视频文件最简单的形式:
XML/HTML Code复制内容到剪贴板
- <video src="foo.mp4" width="300" height="200" controls>
- Your browser does not support the <video> element.
- video>
目前的 HTML5 规范草案还没有指定浏览器应该在 video 标签中支持哪种视频格式。但是最常用的视频格式是:
Ogg:带有 Thedora 视频编码器和 Vorbis 音频编码器的 Ogg 文件。
mpeg4:带有 H.264 视频编码器和 AAC 音频编码器的 MPEG4 文件。
我们可以使用带有媒体类型和其他属性的
XML/HTML Code复制内容到剪贴板
- HTML>
- html>
- 身体>
- 视频 宽度="300" 高度="200" 控制自动播放>
- 来源 src="/html5 /foo.ogg" 类型="视频/ogg" /> ;
- 来源 src="/html5 /foo.mp4" 类型="video/mp4" /> ;
- 您的浏览器不支持 视频>元素。
- 视频>
- 身体>
- html>
视频属性规范
HTML5视频标签可以使用多个属性控制外观和感觉以及各种控制功能:
属性 | 描述 |
---|---|
autoplay | 如果指定这个布尔值属性,只要没有停止加载数据,视频就会立刻开始自动播放。 |
autobuffer | 如果指定这个布尔值属性,即使没有设置自动播放,视频也会自动开始缓冲。 |
controls | 如果指定这个属性,就允许用户控制视频播放,包括音量控制,快进,暂停或者恢复播放。 |
height | 这个属性以 CSS 像素的形式指定视频显示区域的高度。 |
loop | 如果指定这个布尔值属性,表示允许播放结束后自动回放。 |
preload | 指定这个属性,视频会在载入页面时加载并准备就绪。如果指定自动播放则忽略。 |
poster | 这是一个图像 URL,显示到用户播放或快进。 |
src | 要嵌入的视频 URL。可选,可以在 video 块中使用 |
width | 这个属性以 CSS 像素的形式指定视频显示区域的宽度。 |
嵌入音频
HTML5 支持的
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

AI Hentai Generator
免费生成ai无尽的。

热门文章
仓库:如何复兴队友
1 个月前
By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.能量晶体解释及其做什么(黄色晶体)
2 周前
By 尊渡假赌尊渡假赌尊渡假赌
Hello Kitty Island冒险:如何获得巨型种子
1 个月前
By 尊渡假赌尊渡假赌尊渡假赌
击败分裂小说需要多长时间?
4 周前
By DDD
R.E.P.O.保存文件位置:在哪里以及如何保护它?
4 周前
By DDD

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

Klipsch Flexus Core 300 是该系列中的顶级型号,在该公司的条形音箱系列中位于现有的 Flexus Core 200 之上。根据 Klipsch 的说法,这是世界上第一款声音可以适应现实的条形音箱。
