html5与html4的区别

html5的出现,对于web意义重大,它的意图是想把目前web上存在的各种问题一并解决掉。
web浏览器之间的兼容性低,
文档结构不够明确
web应用程序的功能受到限制
世界知名浏览器厂商对html5的支持(微软,google,苹果,Opera,Mozilla)
 
语法的改变
内容类型
DOCTYPE声明
指定字符编码
<!DOCTYPE html>
<html>
<head lang="en">
     <meta charset="utf-8">
     <title></title>
</head>
<body>
</body>
</html>
 
可以省略标记的元素
具有boolean值得属性
<input type="checkbox" checked>   true
<input type="checkbox" checked="checked">   true
<input type="checkbox" checked="">  true
<input type="checkbox">   false
省略引号
<input type="checkbox" checked=checked>   true
 
新增的元素和废除的元素
新增的结构元素
section(可以与h1到h6结合使用,表示文档的结构)
article(与上下文不相关的一块独立的内容,报纸中的一篇文章或博客中的一篇文章)
aside    (与article内容相关的辅助信息) 
header (一个内容区域块,头部)
hgroup (对整个页面或页面中的整个标题部分进行结合)
footer (页面中的一个区域块,主要放一些底部信息)
nav  (导航)
figure (一般表示文档主题流中的一个独立的单元) 
新增的其他元素
video    audio   embed    mark   progress   meter   time   ruby   rt   rp  
wbr    canvas   command    details   datalist    datagrid   keygen   output   source   menu
新增的input元素的类型
email   url  number   range   DatePickers
 
废除的元素
能使用css替代的元素:basefont  big   center   font   s   tt   u等
不再使用frame框架   只支持iframe
只有部分浏览器支持的元素
其他被废除的元素
新增的属性
表单相关的属性
链接相关的属性
其他属性
废除的属性
 
全局属性
contentEditable属性(true  false)
允许用户编辑元素中的内容,该元素必须是可以获得到鼠标焦点的元素,
在点击后像用户提供一个插入符号,提示用户该元素内容可以编辑。
具有可继承性。
<h2>可编辑列表</h2>
<ul contenteditable="">
     <li>列表1</li>
     <li>列表2</li>
     <li>列表3</li>
</ul>
designMode属性 (on  off)
用来指定整个页面是否可编辑,当页面可编辑时,页面中任何支持contenteditable属性的元素,
都变为可编辑状态。只能在javascript脚本里被修改编辑,
hidden属性(true  false)
在html5中,所有的元素都允许使用hidden属性,通知浏览器不渲染该元素,使该元素处于不可见状态。
<h2>可编辑列表</h2>
<ul hidden="">
     <li>列表1</li>
     <li>列表2</li>
     <li>列表3</li>
</ul>
列表不可见了。
spellcheck属性
针对 input  和 textarea 这两个文本输入框提供的一个新属性,对文本输入的内容进行语法和拼写检查。
<input type="text" spellcheck="">
tabindex属性(可以用负值,tab键无法获取)
当不断敲击tab键,让页面中的窗口或控件获得焦点,对页面中的所有控件进行遍历,
每个控件中的tabindex表示该控件是第几个被访问到的,
<a href="#" tabindex="1">hello</a>
<a href="#" tabindex="3">hello</a>
<a href="#" tabindex="2">hello</a>
<ul tabindex="-1">
     <li>1</li>
     <li>2</li>
     <li>3</li>
     <li>4</li>
</ul>
posted @ 2017-03-03 10:58  letitia_blog  阅读(148)  评论(0编辑  收藏  举报