专栏首页eadelaHTML5-autio、video视频音频

HTML5-autio、video视频音频

完整版视屏web播放器:

基本autio和ideo介绍

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!--embed:可以直接插入音频视频,本质是通过本机安装的音频视频播放软件来播放的。要求必须已经安装了这些软件  兼容性-->

<!--flash:  1.先学习flash,增加使用成本  2.iphone,ipd,不支持flash-->

<!--audio:音频-->
<!--
src:播放文件的路径
controls:音频播放器的控制器面板
autoplay:自动播放
loop:循环播放-->
<!--<audio src="../mp3/aa.mp3" controls></audio>-->

<!--video:视频-->
<!--
src:播放文件的路径
controls:音频播放器的控制器面板
autoplay:自动播放
loop:循环播放
poster:指定视频还没有完全下载完毕,或者用户没有点击播放前显示的封面。 默认显示当前视频文件的第一副图像
width:视频的宽度
height:视频的高度
-->
<!--注意事项:视频始终会保持原始的宽高比。意味着如果你同时设置宽高,并不是真正的将视频的画面大小设置为指定的大小,而只是将视频的占据区域设置为指定大小,除非你设置的宽高刚好就是原始的宽高比例。所以建议:在设置视频宽高的时候,一般只会设置宽度或者高度,让视频文件自动缩放-->
<!--<video src="../mp3/mp4.mp4" poster="../images/l1.jpg" controls  height="600"></video>-->

<!--source:因为不同的浏览器所支持的视频格式不一样,为了保证用户能够看到视频,我们可以提供多个视频文件让浏览器自动选择-->
<!--<video src="../mp3/flv.flv" controls></video>-->
<video controls>
    <!--视频源,可以有多个源-->
    <source src="../mp3/flv.flv" type="video/flv">
    <source src="../mp3/mp4.mp4" type="video/mp4">
</video>
</body>
</html>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • HTML5-新增type属性

    eadela
  • IOS-swift5.1快速入门之旅

    传统表明,新语言中的第一个程序应在屏幕上打印“Hello,world!”字样。在Swift中,这可以在一行中完成:

    eadela
  • 运维工程师学习知识点(技能)

    linux系统、常用命令、应用软件(特别是nginx,tomcat,redis,mysql)、shell

    eadela
  • 腾讯云 Elasticsearch 实战篇(二十二) ES6.8权限使用配置

    在前面的章节中我们讲了开源架构ELK、腾讯云Elasticsearch产品系列。我们也知道了,在构建腾讯云ES集群的时候,我们选择的6.8.2白金版具备...

    南非骆驼说大数据
  • HTML基础03-HTML标签(下)03-表单标签

    使用表单的目的是为了收集用户信息。在网页中,如果需要与用户进行交互,收集用户资料,此时就需要表单。

    yangjiao
  • 【解决方案】安防可视化搭建“产业大脑”,打造服务型智慧政府

    产业作为经济发展的基石,挺起了一座城市的脊梁。城市之间的经济竞争归根到底是产业实力的竞争,如何提高产业治理效能、推进产业高质量发展,是政府亟待解决的重要问题。产...

    TSINGSEE青犀视频
  • iOS开发常用之 HUD 弹窗

    GuangdongQi
  • 飞桨视频理解黑科技开源,支持3000个实用标签

    意料之外,一场疫情解锁了上班族的存封已久厨艺技能,“秒会陕西正宗凉皮”、“电饭煲实现蛋糕梦”……无数美食短视频帮助帅哥靓妹登上了厨房的舞台,舌尖上的中国再次风靡...

    用户1386409
  • centos7下nginx使用tmp目录问题

    1.nginx配置中使用tmp目录就是无法访问,换成其他目录正常。 原因:这个是linux系统中关于private tmp的一个配置。

    @凌晨
  • Mac系统 如何命令行下快速打开sublime

    Mac 上命令行操作 sublime 打开文件是如何实现的呢?其实很简单 ,只需添加一个软连接即可。 具体方法如下:

    hedeqiang

扫码关注云+社区

领取腾讯云代金券