1. 音频标签<audio>
<audio src = “./music/Alone.mp3” controls autoplay loop = “3” ></audio>
controls :在页面中显示音乐播放控件 autoplay :页面加载自动播放
loop :设置循环播放次数
·浏览器音乐格式兼容 浏览器默认按顺序查找兼容格式
<audio controls>
<source src = “./music/Alone.mp3”>
<source src = “./music/Alone.wav”>
<source src = “./music/Alone.ogg”>
浏览器不支持HTML5音频播放 （页面提示）
</audio>
2. 视频标签<video>
<video src = “./video/movie.mp4” controls autoplay>
controls :在页面中显示视频播放控件 autoplay :页面加载自动播放
<video>标签类似<img>可以设置宽高位置等属性
·浏览器视频格式兼容 浏览器默认按顺序查找兼容格式
<video controls>
<source src = “./video/movie.mp4”>
<source src = “./video/movie.ogg”>
浏览器不支持HTML5视频播放 （页面提示）
</video>
3. 表单构造标签<input>
① (<label>的for属性与<input>的id相关联，点击label中的email:可以使input获取焦点)
<label for = “demo”>
email: <input type = “email” id = “demo”>
</label>
这样可使获取焦点的范围扩大，在移动端触屏具有便利优势。
② <input>标签构造表单基本类型归纳
| |
<input type="email"> |
输入邮箱格式 |
| tel |
<input type="tel"> |
输入手机号码格式 |
| url |
<input type="url"> |
输入url格式 |
| number |
<input type="number"> |
输入数字格式 |
| search |
<input type="search"> |
搜索框（体现语义化） |
| range |
<input type="range"> |
自由拖动滑块 |
| color |
<input type="color"> |
拾色器 |
| time |
<input type="time"> |
|
| date |
<input type="date"> |
|
| datetime |
<input type="datetime"> |
|
| month |
<input type="month"> |
|
| week |
<input type="week"> |
|
| reset |
<input type="reset" value="重置"> |
重置form表单中输入的内容 |
其中color,month,week等标签都具备兼容性问题，尤其以color突出。
③ <input>标签，基本表单属性归纳
| placeholder |
<input type="text" placeholder="请输入用户名"> |
占位符 |
| autofocus |
<input type="text" autofocus> |
自动获得焦点 |
| multiple |
<input type="file" multiple> |
多文件上传 |
| autocomplete |
<input type="text" autocomplete="off"> |
自动完成 |
| form |
<input type="text" form="某表单ID"> |
与其他<form>表单关联，一同提交 |
| novalidate |
<form novalidate></form> |
关闭验证 |
| required |
<input type="text" required> |
必填项 |
| pattern |
<input type="text" pattern="\d"> |
自定义验证,可定义正则验证 |
直接在input标签中添加属性如：<input required placeholder="请输入用户名">
④ <input>标签，list属性使用
<input list = “index”>
<datalist id = “index”>
<option value = “php”></option>
<option value = “python”></option>
<option value = “photoshop”></option>
<option value = “java”></option>
</datalist>
4. 表单list关联标签<datalist>：数据列表
<label for = “program”>
课程：<input list = “index” id = “program”>
</label>
<datalist id = “index”>
<option value = “php”></option>
<option value = “python”></option>
<option value = “photoshop”></option>
<option value = “java”></option>
</datalist>
5. 生成加密字符串标签<keygen>
生成提交给服务器的加密处理的内容。
6. 输出结果标签<output> 语义化作用
与<input>输入相对，使用方法类似一个<span>标签，在页面上展现一个字符串。
7. 度量器标签<meter>
<label for = “”>
度量器：<meter min=”0” max=”100”low=”60”high=”80”value=”50”></meter>
</label>
8. 一个基本表单（<form>,<fieldset>,<legend>,<label>,<input>）
<form> （创建一个表单，便于统一提交所有填写内容，以form为单位提交内容，
可与input的form属性关联）
<fieldset> （将表单元素进行分组，默认创建一个边框）
<legend>这是一个表单</legend> （为fieldset标签定义标题）
<label for = “”> （使用for关联一个input）
email: <input type = “email” >
</label>
<label for = “”> （使用for关联一个input）
tel: <input type = “tel” >
</label>
</fieldset>
</form>