HTML5 <video> 标签使用

215 阅读1分钟

定义和用法

<video>标签定义视频,比如电影片段或其他视频流。

<video src="movie.ogg" controls="controls">
您的浏览器不支持 video 标签。
</video>

属性

属性描述
autoplayautoplay如果出现该属性,则视频在就绪后马上播放。
controlscontrols如果出现该属性,则向用户显示控件,比如播放按钮。
heightpixels设置视频播放器的高度。
looploop如果出现该属性,则当媒介文件完成播放后再次开始播放。
preloadpreload如果出现该属性,则视频在页面加载时进行加载,并预备播放。如果使用 "autoplay",则忽略该属性。
srcurl要播放的视频的 URL。
widthpixels设置视频播放器的宽度。

其他属性


src="video.mp4" /*视频地址*/
controls = "true" /*是否显示播放控件*/
poster="images.jpg" /*视频封面*/
preload="auto" /*预加载*/
webkit-playsinline="true" /*IOS中让视频在小窗内播放而不是全屏播放*/  
playsinline="true" /*IOS微信浏览器支持小窗内播放*/ 
x-webkit-airplay="allow" /*是否支持ios的AirPlay功能*/
x5-video-player-type="h5" /*启用H5播放器,是wechat安卓版特性*/
x5-video-player-fullscreen="true" /*设置为true防止横屏*/
x5-video-orientation="portraint" /*播放器的方向,landscape横屏,portraint竖屏,默认值为竖屏*/