前端HTML5与HTML的区别以及新增特性

一.HTML5与HTML的区别

HTML5不基于SGML（Standard Generalized Markup Language 标准通用标记语言），
因此不需要对DTD（DTD 文档类型定义）进行引用，但是需要DOCTYPE来规范浏览器行为。

二.HTML5新特性

1.新增标签

• header — 头部标签
• nav — 导航标签
• article — 内容标签
• section — 块级标签
• aside — 侧边栏标签
• footer — 尾部标签

2.视频与音频的使用

1.视频

1. source兼容不同视频格式以及语法

<source src="myvideo.ogv" type="video/ogg"></source>
		 <source src="myvideo.webm" type="video/webm"></source> -->

2.有哪些值？

• autoplay---------视频加载完成后自动播放
• controls---------给视频添加控件
• loop---------循环播放
• muted---------静音播放
• poster---------用户下载时显示的图像 ,值为url
• preload---------边加载边播放–>

3.示例

<video width="300" height="" autoplay controls loop muted >
		 	<source src="../使用的视频.mp4" type="video/mp4"></source>
		 </video> -->
		 <!-- <video width="300" height="" autoplay controls loop src="../222222.mp4">

4.音频

音频与使用方法与视频方法一样，所使用的值也相同 但就是所使用标签不同

代码示例

<audio src="../11111.mp3" autoplay controls></audio>

三.input的type属性值

• text --------- 默认文本
• button---------按钮
• password ---------密码
• radio---------单选
• checkbox---------多选
• submit---------提交
• reset---------重置
• number---------数字
• date---------日期
• file---------上传文件
• email---------邮箱
• tel---------手机号码
• url ---------网址
• search---------搜索
• color---------颜色

四.表单特性

• placeholder表单提示文字
• required校验表单不能为空
• multiple选择多个文件上传
• autocomplete 启用on 关闭off 提交记录
• min max 通常与数字和日期类型一起使用
• pattern表单正则验证
• step给默认数字类型上下箭头提供跳跃的数字
• readonly只读属性
• disabled禁用属性

1.语法

<form>
			<input type="text" name="" required id="" value="" placeholder="请输入"/>
			<input type="text" name="" id="" value="" autofocus placeholder="请输入"/>
			<input type="file" multiple name="" id="" value="" />
			<input type="submit" value="提交"/>
		</form>

2.代码示例

<form autocomplete="on">
		  First name:<input type="text" name="fname" pattern="[A-Za-z]{3}"><br>
		  2222222222: <input type="text" name="lname" disabled><br>
		  Last name: <input type="number" name="" step="3"><br>
		  E-mail: <input type="email" name="email" autocomplete="on"><br>
		  <input type="submit">
		</form>

该篇完结 努力学习 天天向上！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！！