zoukankan      html  css  js  c++  java
  • HTML5-Y音频与视频

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>音频与视频</title>
    </head>
    <body>
    <!--audio标签控制音频视频的 加了controls后浏览器里会出现音频播放器的控制器-->
    <!--autoplay页面打开后自动播放 loop循坏播放 2表示循坏2次-->
    <!--各个浏览器对音频的兼容问题:IE支持mp3、火狐支持oggvorbis/wav、chrome支持oggvorbis/wav、
    opera支持oggvorbis/wav、safari支持mp3/wav。-->
    <!--这样的写法浏览器就能自己找到相匹配的音频 页面只出现一个-->
    <audio controls autoplay loop="3">
    <sourse src="../see you again.mp3"></sourse>
    <sourse src="../see you again.wav"></sourse>
    <sourse src="../see you again.ogg"></sourse>
    这句话在浏览器中会显示比如IE某款都不支持就出现了这句话让客户看到了

    <video width="100" controls autoplay loop="2">
    <!--在指定视频宽高是 控制条没有改变大小 所以只设置width就好了-->
    <sourse src="!!!!!!.mp4"></sourse>
    <sourse src="!!!!!!.ogg"></sourse>
    <sourse src="!!!!!!.wenm"></sourse>
    </video>
    <!--IE9开始支持mp4/火狐3.5开始支持ogg、4.0开始支持webm/opera10.5开始支持ogg、10.6开始支持webm/
    chrome5.0开始支持mp4和ogg、6.0开始支持webm/safari3.0开始支持mp4。-->
    <!--想达到各个浏览器兼容和音频一样-->
    </audio>
    </body>
    </html>

  • 相关阅读:
    记一次百度面试题
    深度拷贝对象
    spring boot 学习笔记
    mac Zip 常用命令
    Mac OS 终端下使用 Curl 命令下载文件
    懒人必备的移动端定宽网页适配方案
    前端面试题之 sum(2)(3) (链式调用,toString,柯里化,数组操作)
    web上的复制
    fileupload上传文件时带参数
    Mac下Nginx环境配置
  • 原文地址:https://www.cnblogs.com/hello-web/p/6992496.html
Copyright © 2011-2022 走看看