HTML 5 基础

HTML 参考手册

HTML 5 视频

controls 属性供添加播放、暂停和音量控件。
<video src="movie.ogg" width="320" height="240" controls="controls">
Your browser does not support the video tag.
</video>

video 元素允许多个 source 元素。source 元素可以链接不同的视频文件。浏览器将使用第一个可识别的格式：
<video id="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>

属性	                值	            描述
autoplay       autoplay	    如果出现该属性，则视频在就绪后马上播放。
controls        controls	    如果出现该属性，则向用户显示控件，比如播放按钮。
height	     pixels	            设置视频播放器的高度。
loop              loop	            如果出现该属性，则当媒介文件完成播放后再次开始播放。
preload	    preload	    如果出现该属性，则视频在页面加载时进行加载，并预备播放。如果使用 "autoplay"，则忽略该属性。
src	            url	            要播放的视频的 URL。
width	    pixels	            设置视频播放器的宽度。

Video + DOM
var myVideo=document.getElementById("video");
myVideo.play();
myVideo.pause();
myVideo.width=320;

HTML 5 音频

<audio src="song.ogg" controls="controls">
Your browser does not support the audio tag.
</audio>

source 元素可以链接不同的音频文件。浏览器将使用第一个可识别的格式：
<audio controls="controls">
  <source src="song.ogg" type="audio/ogg">
  <source src="song.mp3" type="audio/mpeg">
Your browser does not support the audio tag.
</audio>

属性            	值	               描述
autoplay	    autoplay	    如果出现该属性，则音频在就绪后马上播放。
controls	    controls	    如果出现该属性，则向用户显示控件，比如播放按钮。
loop	            loop	            如果出现该属性，则每当音频结束时重新开始播放。
preload	    preload	    如果出现该属性，则音频在页面加载时进行加载，并预备播放。如果使用 "autoplay"，则忽略该属性。
src	            url	            要播放的音频的 URL。

HTML5 Input 类型

E-mail: <input type="email" name="user_email" />    //在提交表单时，会自动验证 email 域的值。
Homepage: <input type="url" name="user_url" />    //在提交表单时，会自动验证 url 域的值。
Points: <input type="number" name="points" min="1" max="10" />
Points: <input type="number" name="points" min="1" max="10" />    //range 类型用于应该包含一定范围内数字值的输入域。range 类型显示为滑动条。
Date: <input type="date" name="user_date" />    //日期选择器
HTML5 拥有多个可供选取日期和时间的新输入类型：
    date - 选取日、月、年
    month - 选取月、年
    week - 选取周和年
    time - 选取时间（小时和分钟）
    datetime - 选取时间、日、月、年（UTC 时间）
    datetime-local - 选取时间、日、月、年（本地时间）