<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

        "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title></title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

</head>

<body>

<h2>HTML5之前播放视频的方式</h2>

<h3>使用embed标签播放flash（所有的浏览器都可用，但在HTML4中不包括在Web的标准中）</h3>

<embed type="application/x-shockwave-flash"

           src="zq.swf" width="500" height="430"> </embed>

<h3>使用object标签播放flash（IE8及以下不可用）</h3>

<object type="application/x-shockwave-flash"

            data="zq.swf" width="500" height="430">

</object>

<h3>只用于IE的低版本，从IE11开始不提供支持，其它浏览器不可用</h3>

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"

            width="500" height="430">

  <param name="src" value="zq.swf" />

</object>

<h3>使用object兼容所有的浏览器</h3>

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"

            width="500" height="430">

  <param name="src" value="zq.swf" />

  <object type="application/x-shockwave-flash"

                data="zq.swf" width="500" height="430">

  </object>

</object>

<h3>使用object和embed确保一定要兼容所有的浏览器</h3>

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"

            width="500" height="430">

  <param name="src" value="zq.swf" />

  <embed type="application/x-shockwave-flash"

               src="zq.swf" width="500" height="430"> </embed>

</object>

<h3>使用embed标签播放mp4文件（有的浏览器内置了插件，有的需要下载，不方便）</h3>

<embed src="lesson-0.mp4" autostart="false" width="640" height="360"> </embed>

<!--autostart="false"  设置不自动播放，只在IE中有效-->

<h3>使用object标签播放mp4文件（IE8及以下不可用）</h3>

<object data="lesson-0.mp4" width="640" height="360">

</object>

<h3>使用object标签播放mp4文件（只用于IE，需要下载插件，其他浏览器不可用）</h3>

<object width="640" height="360"

            classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"

            codebase="http://www.apple.com/qtactivex/qtplugin.cab">

  <param name="src" value="lesson-0 ">

</object>

<h3>总结</h3>

<p>很乱。。很乱。。其实兼容性最好的方式是使用 embed 标签播放flash。。但是flash已经被苹果抛弃。。</p>

</body>

</html>
 
<audio controls="controls" height="100" width="100">

  <source src="song.mp3" type="audio/mp3" />

  <source src="song.ogg" type="audio/ogg" />

<embed height="100" width="100" src="song.mp3" />

</audio>

最好的 HTML 解决方法

HTML 5 + <object> + <embed>

<video width="320" height="240" controls="controls">

  <source src="movie.mp4" type="video/mp4" />

  <source src="movie.ogg" type="video/ogg" />

  <source src="movie.webm" type="video/webm" />

  <object data="movie.mp4" width="320" height="240">

    <embed src="movie.swf" width="320" height="240" />

  </object>

</video>

优酷解决方案

在 HTML 中显示视频的最简单的方法是使用优酷等视频网站。

如果您希望在网页中播放视频，那么您可以把视频上传到优酷等视频网站，然后在您的网页中插入 HTML 代码即可播放视频：

<embed src="http://player.youku.com/player.php/sid/XMzI2NTc4NTMy/v.swf"

width="480" height="400"

type="application/x-shockwave-flash">

</embed>

https://www.w3school.com.cn/html/html_video.asp

HTML中的音频 视频 的播放代码的更多相关文章

  1. iOS 微信 音频 视频自动播放

    iOS 微信 音频 视频自动播放 http://www.w3ctech.com/topic/1165

  2. 音频视频的播放的进度调整(以.net为例)

    Background:对于音视频在线播放,一些小应用是靠nginx处理访问视频.音频文件的请求,对外应用的一般会托管至各种云上使用相关的服务.前者存在巨大的安全隐患,后者会有一定的成本.有的时候还是需 ...

  3. HTML网页中添加音频视频动画...(转)

    在网页中适当嵌入音频和视频能够充分显示网页的多媒体特性,特别是随着宽带网的普及,使得网络广播和网络视频成为现实,网页音频和视频的重要性也日益突显.具体来说,网页音频和视频的嵌入方法主要有三种: 一.b ...

  4. HTML在网页中插入音频视频简单的滚动效果

    每次上网,打开网页后大家都会看到在网页的标签栏会有个属于他们官网的logo,现在学了HTML了,怎么不会制作这个小logo呢,其实很简单,也不需要死记硬背,每当这行代码出现的时候能知道这是什么意思就o ...

  5. Unity3d:使用uWebKit插件嵌入网页，网页中的flv视频无法播放

    问题描述:unity3d程序,使用uWebKit插件嵌入网页,用来播放FLV视频,有的电脑可以正常播放,有的电脑在网页中播放不了ps:网页中的播放器用的是player.swf解决方案:是由于网页中的播 ...

  6. iphone在微信中audio 音频无法自动播放

    问题: Html5的audio 音频在电脑端和android端都可以实现自动播放,在iphone上无法实现,下面针对的是微信浏览器里面的解决方法 html代码: <div id="au ...

  7. iframe插入视频自动播放代码

    <iframe marginwidth=0 marginheight=0 src='http://www.wsview.com/yzplayerAction!play2.action?autoP ...

  8. html5 css3 背景视频循环播放代码

    <div style ="position: absolute; z-index: -1; top: 0px; left: 0px; bottom: 0px; right: 0px; ...

  9. 网页背景H5视频自动播放---PC端、移动端兼容问题完美解决方案（IOS、安卓、微信端）

    最近公司官网需要使用视频当做banner背景且自动播放,并且因为是官网需要做到PC端和移动端都可以适配兼容,这些问题很是头疼: 兵来将挡,水来土掩,进过查阅相关技术资料,现已完美兼容PC端和移动端.下 ...

随机推荐

  1. 使用spring aop 记录接口日志

    spring配置文件中增加启用aop的配置 <!-- 增加aop 自动代理配置 --> <aop:aspectj-autoproxy /> 切面类配置 package com. ...

  2. uiautomator手动调试与快速高度设置

    创建java工程:Demo1包名:com.bing.cn类名:Test测试用例:testDemo android create uitest-project -n Demo1 -t 7 -p E:\e ...

  3. python27期day03：字符串详解：整型、可变数据类型和不可变数据类型、进制转换、索引、切片、步长、字符串方法、进制转换、作业题。

    1.%s: a = "我是新力,我喜欢:%s,我钟爱:%s"b = a%("开车","唱跳rap")print(b)2.整型: 整数在Pyt ...

  4. maven项目目录（二）

    -- 项目目录 --src 项目中的所有资源 --main 存放开发代码和资源 --java 项目的java源代码 --resources 项目的资源文件,源代码之外的其他文件 --test 存放测试 ...

  5. 【作用域】词法作用域（静态作用域，如：js）、动态作用域（如：.bash脚本）

    作用域 作用域是指程序源代码中定义变量的区域. 作用域规定了如何查找变量,也就是确定当前执行代码对变量的访问权限. JavaScript 采用词法作用域(lexical scoping),也就是静态作 ...

  6. 权限维持：Win2008以上的iis

    参考文章:https://mp.weixin.qq.com/s/z1d3yvp14GWakyonTh_b8A 浅谈原理 在 .Net 中,HttpModule 其实就是实现了 IHttpModule ...

  7. dl-google.com 的问题

    印象里,如果用过公司vpn之后,再用android studio, 这个地址就能被解析下载了. 看来,应该只是域名被屏蔽,ip并没有. 所以,以后拿到ip之后,写进hosts里应该没事 https:/ ...

  8. 记一次排错经历,requests和fake_useragent

    在部署tornado项目上线时, 首次重启服务后第一次请求必然会报错, 后续的就能正常访问, 长报错urllib.error.URLError,如图排查多次依然发现不了问题 报的最多的依然是上图中的错 ...

  9. 关于RAMOS所用的操作系统

    关于RAMOS所用的操作系统 RAMOS所用的操作系统,XP就不用说了,精简版最小的600MB到1.5GB的都有.现代意义上的WIN7/8/10 RAMOS一般选用精简版操作系统,节约内存的同时,还能 ...

  10. 【微信小程序】小程序中的函数节流

    大ga吼! 很久没写博客咯,今天学到了一点新知识, 记录分享一下~ 摘要: 小程序中的函数节流 场景: 从商城列表进入商品详情中时,或者生成,提交订单, 付款的时候, 若用户快速点击(一秒8键,母胎s ...