HTML5推出的理由
推出的缘由和目标
目前web端存在一些问题，比如兼容性问题，同样的页面，在不同浏览器上显示的效果不一样，那么开发人员需要做很多额外的工作去解决这一问题，需要花费大量的时间在这上面，一些特殊的权限没有开发给开发人员，比如：定位权限，拉起拍照权限，动画。绘画。那么h5的推出就是为了解决这一序列问题。
h5解决了什么问题：
（1）开发了一些特殊的权限给开发者：有了这些权限，开发者可以很轻易的获取用户定位信息，拍照功能等
（2）解决不同浏览器的兼容性问题:html5也可以理解为协议标准，他让绝大部分浏览器生产商都遵守这一标准
（3）文档结构不清晰：在之前的开发中，页面的布局都是使用div+css，不利于搜索引擎去抓取页面信息，比如，浏览器抓取一片新闻网页的时候，根本抓不到作者，新闻发布时间等信息
h5浏览器支持情况：
（1）Chrome，Firefox：支持html5很多年，而且有自动升级，支持最好。
（2）Safari，Opera：同样支持html5很多年，支持也很好。
（3）IE：IE10起比较好了，之前很差。（IE+9都可以）
1.2语法的改变
（1）内容类型（contentType）：HTML的后缀名依旧是HTML或htm。文件的内容类型“text/html”
（2）Doctype
h5:之前
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
h5:
<!DOCTYPE html>
（3）Doctype声明在ＨＴＭＬ文档中必不可少，位于HTML文档的第一行代码，随着HTML版本的更新，其声明方式也在更改。但是h5放入Doctype的声明方式向下兼容（兼容所有低版本）
（3）字符集
h5之前：
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
h5：
<meta charset="UTF-8">
ＨＴＭＬ５默认字符集编码：utf-8：之前大部分版本默认字符集编码：lso-8859-1
（4）标签省略
可以省略全部：body，tbody，head，colgroup，html
不允许写结束标记的标签：img、input、br 、hr、link、meta
允许写结束标记的标签：p、li、dt、dd、tr、th。。。
（5）布尔类型的属性，比如：readonly、disabled
对于布尔类型的属性，比如：readonly，disabled，checked，selected
当他们不写值的时候，默认是true。同样对于值是任何东西是无效的，说白了，只要写这个属性，即立即生效
（6）属性值省略引号
（7）在之前的学习中，属性值都是放在单引号双引号里面的，在h5中如果属性值中双引号不包括特殊字符，双引号和单引号都可以去掉
特殊字符：“<”,“>”,“=”
<div>""可以去除<input type=text readonly="readonly"/></div>
<div>''改成单引号<input type='text' readonly=""/></div>
<div>value="登陆"<input type="text" value="登陆" readonly/></div>
<div>value="登陆"<input type="text" value=<登陆> readonly/></div>
1.3新增和废弃的元素新增和废弃的属性
新增的结构（布局）标签：section、acticle、nav、footer、header 、hgroup、aside、figure
新增的其他标签：video，audio,mark,time,menu,canvas,svg,details,
datalist,progress,output,source
input type的新增：email，url,number ,date,pickers,range
废弃标签：font，center，s,tt,u,big,basefont
1.4全局属性
在HTML5中定义了少量对所有元素都有效的属性
1.contenteditable：
<p contenteditable="true">这是一个段落，但是我可以编辑</p>//可以编辑
<p contenteditable="false">这是一个段落，我不可以编辑</p>//不可以编辑
<p contenteditable>这是一个段落，我没有设置contenteditable的值</p>//同1
contenteditable=true可以直接在页面上进行编辑，编辑之后，元素的高宽自动适应。
contenteditable=false，说明这个标签不能被编辑
注意：如果只是设定了contenteditable，其默认值是true
contenteditable属性可以被继承，需要考虑“就近原则”
designMode：
用来指定整个页面是否可以编辑，当designMode设置为on的时候，相当于页面上所有的元素都设置了contenteditable=true
<script>
document.designMode="on";
</script>
当designMode设置为off的时候，相当于页面上所有的元素都设置了contenteditable=false
<script>
document.designMode="off";
</script>
注意如果同时设置designMode和contenteditable属性，最终是否可以编辑，采用就近原则
（2）该属性在IE8以下的浏览器无效。。以兼容IE6,7,8为耻
hidden属性可以实现对元素的隐藏，隐藏的元素下面不会被显示，同时不会占原有位置。类似于hidden默认值是“hidden”所以呢？设置该属性的时候，只需要属性名就可以了
hidden看不见不占位置
visibility：hidden看不见占位置
display：none：看不见，不占位置
4.spellcheck
spellcheck属性是html5专门为input和textarea标签提供的新属性，他的功能是对用户输入的内容进行拼写和语法检查，如果拼写错误了，文字下面有一个波浪线
spellcheck =false取消语法和拼写检查
spellcheck =true开启语法和拼写检查
请输入英文试试
<input type="text" spellcheck="true"/>
<textarea spellcheck="true" type="text"/>
tabindex=“正整数”：按键盘tab键可以选中（获取焦点），这里选择的标签可以是input输入框，input按钮、a标签等等，同时按tab键选择的顺序和设置的tabindex属性一致，tabindex值越大，越后面选中，建议不使用tabindex=0；
tabindex=-1，按tab不选中
477
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
