html5 要解决三个问题
1>浏览器之间的兼容性很低
2>文档结构不够明确
3>web应用程序的功能受到限制
html5 相比html4的变化
1>doctype声明
<!DOCTYPE html>
2>指定字符编码
html4-> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
html5-> <meta charset="utf-8">(不能同时使用)
3>新增的结构元素
->section 表示页面中的一个内容区块
->article 表示页面中的一块与上下文不想关的内容,比如博客总的一篇文章或报纸中的一篇文章
->aside 表示与article元素的内容之外的,但与article元素内容相关的辅助信息
->header 表示页面中一个内容区块或整个页面的标题
->hgroup 对标题进行组合
->footer 表示页面中一个内容区块或整个页面的脚注
->nav 表示页面中导航链接的部分
->figure 表示一段独立的流内容,一般表示文档主体流内容中的一个独立单元,使用figcaption元素为figure元素组添加标题.
->video 定义视频
->audio 定义音频
->source 定义媒介元素
->embed 用来插入各种多媒体
->mark 呈现需要突出显示或高亮的文字
->progress 表示运行中的进程
->time 日期或时间
->ruby rt rp
->wbr 软换行,宽度够宽时不进行换行
->canvas 画布
->command 表示命令按钮,单选框.,复选框,按钮
->details summary,当用户点击summary,时显示detail,summary时detail的第一个子元素
->datalist 表示可选数据列表,与input连用
->datagrid 表示可选数据列表,以树形列表的形式来显示
->keygen 表示生成密匙
->output 表示不同类型的输出,比如脚本的输出
->menu 表示菜单列表
4>新增input元素的类型
->email
->url
->number
->range
->Date Pickers
5>废除的元素
->能使用css代替的元素,例如basefont,big,center,font,s,strike,tt,u
->不再使用frame框架,废除frameset,frame,noframes,只支持iframe
->只有部分浏览器支持的元素,applet,bgsound,blink,marquee
->其他rb,acronym,dir,isindex,listing,xmp,nextid,plaintext
6>新增的属性
->input(type=text) ,select,textarea,button 指定focus属性
->input(type=text),textarea 指定placeholder
->input,output,select,textarea,button,fieldset 指定form属性,声明它属于哪个表单
->input(tyep=text),textarea 指定required属性
->input autocomplete,min,max,multiple,pattern,step,list元素与datalist元素配合,datalist与autocomplete属性配合,m->ultiple允许用户一次上传多个文件
->input formaction,fromenctype,formmethod,formnovalidate
->input,button,form novalidate 取消验证,表单无条件提交
->a,area media
->area hreflang,rel
->link sizes ,该属性可以与icon元素结合使用(通过rel),指定关联图标的大小
->base target
->ol reversed 倒序
->menu type让菜单可以以上下文菜单,工具条,列表菜单三种形式出现,label为菜单定义一个可见的标注
->style scoped 规定样式的作用范围
->script async 定义脚本是否异步执行
->html manifest 开发离线web应用程序时,它与API结合使用,描述文档的缓存信息
->iframe sandbox,seamless,srcdoc 提高页面安全性
7>废除的属性
->废弃了一些可以由css代替的属性,例如bgcolor,align,border
8>全局属性,HTML5中,新增了一个全局属性 的概念.就是可以对任何元素使用的属性.
->contentEditable,isContentEditable 判断元素是否是可编辑的,从字面上都可以理解,后者是判断,返回值是true或false,前者是用来设置属性的.
->designMode指定整个页面是否可编辑,当页面可编辑时,页面中任何支持contentEditable属性的元素都变成可编辑状态,
designMode属性只能在js中编辑,有两个值"on" 和 "off" ,document.designMode = "on"
->hidden 类似于input元素中的hidden元素,通知浏览器不渲染该元素,true 和 false两个值
->spellCheck 对input(type=text) 和 textarea提供的新属性,有true 和false两个值,如果元素的readonly 或 disabled 的属性为true,则不执行拼写检查
->tabindex 开发中的基本概念,让不断敲击tab键让窗口或页面中控件获得焦点.