Html学习笔记7:嵌入音频和视频

HTML5的<video>元素不需要借助flash插件就可以实现视频播放,有以下常用属性。
视频的URL为src,视频的宽度width,视频的高度height,autoplay设置后表示立刻开始播放视频,preload设置后表示预先载入视频,controls设置后表示显示播放控件,loop设置后表示反复播放视频,muted设置后表示视频处于静音状态,poster指定视频数据载入时显示的图片。

其中的preload属性有三个值:none表示什么都不加载,metadata表示只能加载元数据(宽高、第一帧视频等信息),auto表示请求浏览器尽快下载整个视频。
用来嵌入音频内容,属性只有src,autoplay,preload,controls。用法都一样。

    <!DOCTYPE html>  
    <html lang="zh-cn">  
    <head>  
        <title>音频和视频</title>  
        <meta charset="utf-8">  
    </head>  
    <body>  
        <!-- <video src="test.mp4" width="800" height="600" controls loop poster="tx.jpg" preload="auto"></video> -->  
        <video width="800" height="600" controls loop poster="tx.jpg" preload="auto">  
            <source src="test.webm">  
            <source src="test.mp4">  
            <source src="test.ogg">  
            <object>实现flash插件的播放,如果屏蔽IE9以下,则不需要</object>  
        </video>  
        <audio controls>  
            <source src="test.mp3">  
            <source src="test.m4a">  
            <source src="test.wav">  
        </audio>  
    </body>  
    </html>  

这里写图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值