html5 视频和音乐播放笔记

时间 2019-11-17

标签 html5 html 视频音乐播放笔记栏目 HTML5 繁體版

原文原文链接

Html 5 视频播放：<!DOCTYPE HTML> <html> <body>         <video src="http://www.w3school.com.cn/i/movie.ogg" width="321" height="240" controls="controls">         your browser does not support the video tag.         </video> </body> </html>  ~  播放上面的代码就能够在网页中嵌入视频，src的内容是你视频的地址，controls=”controls”的做用是添加播放暂停和音乐的控件，能够经过width和height来设置大小。<video width="320" height="240" controls="controls">   <source src="movie.ogg" type="video/ogg">   <source src="movie.mp4" type="video/mp4"> Your browser does not support the video tag. </video> 好还能够经过设计一个视频控件多个音视频同时播放，只要在video标签中增长source来指定文件的地址和类型。

<video> 标签的属性

属性html	值html5	描述ide
autoplayoop	autoplayurl	若是出现该属性，则视频在就绪后立刻播放。spa
controls设计	controlscode	若是出现该属性，则向用户显示控件，好比播放按钮。视频
heighthtm	pixels	设置视频播放器的高度。
loop	loop	若是出现该属性，则当媒介文件完成播放后再次开始播放。
preload	preload	若是出现该属性，则视频在页面加载时进行加载，并预备播放。若是使用 "autoplay"，则忽略该属性。
src	url	要播放的视频的 URL。
width	pixels	设置视频播放器的宽度。

HTML 5 全局属性

NEW：HTML 5 中新的全局属性。

属性	值	描述
accesskey	character	规定访问元素的键盘快捷键
class	classname	规定元素的类名（用于规定样式表中的类）。
contenteditable	true false	规定是否容许用户编辑内容。
contextmenu	menu_id	规定元素的上下文菜单。
dir	ltr rtl	规定元素中内容的文本方向。
draggable	true false auto	规定是否容许用户拖动元素。
dropzone	copy move link	规定当被拖动的项目/数据被拖放到元素中时会发生什么。
hidden	hidden	规定该元素是无关的。被隐藏的元素不会显示。
id	id	规定元素的惟一 ID。
lang	language_code	规定元素中内容的语言代码。语言代码参考手册。
spellcheck	true false	规定是否必须对元素进行拼写或语法检查。
style	style_definition	规定元素的行内样式。
tabindex	number	规定元素的 tab 键控制次序。
title	text	规定有关元素的额外信息。

音乐标签：

标签跟上面的video相似

<audio src="song.ogg" controls="controls"> </audio>

你们能够去http://www.w3school.com.cn/html5/html_5_audio.asp参考相应的文档