​一、video标签

1.作用:播放视频

2.格式:<video src="视频地址“></video>

3.可添加的属性:

(1)autoplay="autoplay"代表可以在页面中自动播放,不可被用户中断

(2)controls="controls”用于显示视频的控制条

(3)poster="地址“用于播放视频之前显示什么东西(图片)

(4)loop="loop"循环播放该视频(一般广告就是这么放上去的)

(5)preload=预加载视频(演示的为本地视频视频,所以在这里演示不了)注意:preload与autoplay相冲突。

(6)muted=”muted“静音选项

(7)width、height属性,用于设置视频框的大小。

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>d52_vidoe_labelz</title>

</head>

<body>

<video src="神秘巨星.mp4" controls="controls" poster="image/play_tennis.jpg"  height="500px" width="600px">华盛顿邮报</video>

</body>

</html>

<!--autoplay="autoplay" loop="loop" preload="preload"-->

  

二、源码

d52_vidoe_label1

地址:https://github.com/ruigege66/HTML_learning/blob/master/d52_vidoe_label1

2.CSDN:https://blog.csdn.net/weixin_44630050(心悦君兮君不知-睿)

3.简书:https://www.jianshu.com/u/a9169ca4f1c9(心悦君兮君不知dqr)

4.欢迎关注微信公众号:傅里叶变换

HTML连载8-video标签的更多相关文章

  1. HTML5 audio与video标签实现视频播放,音频播放

    随着互联网的飞速发展以及HTML5的应用,越来越多的项目中用到video,audio当常用标签. <audio> 标签属性 <audio src="song.mp3&quo ...

  2. 巧用transform实现HTML5 video标签视频比例拉伸

    前言 原文地址 曾几何时,项目中有碰到视频比例拉伸的需求,但是发现这个看似再普通不过的一个需求,找遍全网至今都没有找到解决方法.因为强制给video标签设置width和height的话只会将video ...

  3. HTML5 Audio/Video 标签,属性,方法,事件汇总

    HTML5 Audio/Video 标签,属性,方法,事件汇总 (转) 2011-06-28 13:16:48   <audio> 标签属性:src:音乐的URLpreload:预加载au ...

  4. HTML5 video标签播放视频下载原理

    HTML5 video https://github.com/remy/html5demos/blob/master/demos/video.html <video preload=" ...

  5. HTML5的Video标签的属性,方法和事件汇总

    <video>标签的属性 src :视频的属性 poster:视频封面,没有播放时显示的图片 preload:预加载 autoplay:自动播放 loop:循环播放 controls:浏览 ...

  6. video标签的属性和方法总结

    最近想做一个弹幕插件,查了很多video标签的属性和方法 error属性 在正常读取时候,使用媒体数据的过程中,video元素或audio元素的error属性为null,但是任何时候只要出现错误,er ...

  7. 解决h5的video标签,android、ipad客户端播放正常,iphone客户端无法播放

    在做html5时插入一个视频播放标签video后,测试时android.ipad客户端播放正常,唯独iphone自带浏览器无法播放. 解决办法: 判断用户所使用客户端访问h5页面时是iphone时,点 ...

  8. HTML 5 video 标签跨浏览器兼容

    <video width="320" height="240" controls>   <source src="movie.mp4 ...

  9. 微信video标签全屏无法退出bug 本文系转载

    安卓(android)微信里面video播放视频,会被强制全屏,播放完毕后还有腾讯推荐的视频,非常讨厌..强制被全屏无法解决,但是视频播放完毕后退出播放器可以解决.方法就是视频播放完毕后,用音频aud ...

  10. 【HTML5 video】video标签的部分属性解析

    转自:http://www.cnblogs.com/kiter/archive/2013/02/25/2932157.html 现在如果要在页面中使用video标签,需要考虑三种情况,支持Ogg Th ...

随机推荐

  1. Diffie-Hellman Key Exchange – A Non-Mathematician’s Explanation

    The Complete Diffie-Hellman Key Exchange Diagram The process begins when each side of the communicat ...

  2. WPF UserControl 的绑定事件、属性、附加属性

    原文:WPF UserControl 的绑定事件.属性.附加属性 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/Vblegend_2013/arti ...

  3. MySQL于ON DUPLICATE KEY UPDATE采用

    今天我们做的推断插入用途MySQL于ON DUPLICATE KEY UPDATE.现在,Mark下面! 假设你想做的事,再有就是在数据库中插入数据没有数据.如果有数据更新数据,然后你可以选择ON D ...

  4. Android 项目框架功能整理记录

    用来记录自己在项目用到的框架工具等,新人新记录,希望能对你搭建项目有所帮助 常用框架整理 视图绑定注解框架: butterKnife 网络请求框架: OKHttp 图片加载缓存:Gilde 数据格式解 ...

  5. vcmi(魔法门英雄无敌3 - 开源复刻版) 源码编译

    vcmi源码编译 windows+cmake+mingw ##1 准备 HoMM3 gog.com CMake 官网 vcmi 源码 下载 QT5 with mingw 官网 Boost 源码1.55 ...

  6. 1-6 WebAPI基础和演示项目搭建

    启动项目的时候 在控制台用dotnet MsgService.dll的方式启动. 在program.cs文件下做如下修改: 实现在控制台 自定义ip和端口,修改之后有将项目重新生成,在控制台启动项目, ...

  7. C#中的MessageBox消息对话框

    关键字:C# MessageBox 消息对话框 在程序中,我们经常使用消息对话框给用户一定的信息提示,如在操作过程中遇到错误或程序异常,经常会使用这种方式给用于以提示.在C#中,MessageBox消 ...

  8. python win32api 使用小技巧

    前些日子,由于需要,用python写了个小插件,通过win32api 访问外部程序的窗口 并且做些小操作. 因为原来对win32api 不怎么熟悉 所以只好求救.群里有个QQ:32034767 唐骁勇 ...

  9. WPF中使用cefsharp

    原文:WPF中使用cefsharp 新入职一家公司,由写服务端接口变成了软硬件通信.服务器.客户端.C/S.B/S乱七八糟各种打杂.首先接收一个WPF项目,因为不熟WPF,再加上前端我也不熟,我打算使 ...

  10. wpf Content数据绑定StringFormat起作用的原理和解决

    原文:wpf Content数据绑定StringFormat起作用的原理和解决 <Window x:Class="WpfOne.Bind.Bind6" xmlns=" ...