html5新增的属性和废除的属性简要概述


Posted in HTML / CSS onFebruary 20, 2013

HTML5中,在新增加和废除很多元素的同时,也增加和废除了很多属性。

新增的属性

1、表单相关的属性

对input(type=text)、select、textarea与button指定autofocus属性。它以指定属性的方式让元素在画面打开时自动获得焦点。 对input(type=text)、textarea指定placeholder属性,它会对用户的输入进行提示,提示用户可以输入的内容。 对input、output、select、textarea、button与fieldset指定form属性。它声明属于哪个表单,然后将其放置在页面的任何位置,而不失表单之内。 对input(type=text)、textarea指定required属性。该属性表示用户提交时进行检查,检查该元素内必定要有输入内容。 为input标签增加几个新的属性:autocomplete、min、max、multiple、pattern与step。还有list属性与datalist元素配合使用;datalist元素与autocomplete属性配合使用。multiple属性允许上传时一次上传多个文件; pattern属性用于验证输入字段的模式,其实就是正则表达式。step 属性规定输入字段的合法数字间隔(假如 step="3",则合法数字应该是 -3、0、3、6,以此类推),step 属性可以与 max 以及 min 属性配合使用,以创建合法值的范围。 为input、button元素增加formaction、formenctype、formmethod、formnovalidate与formtarget属性。用户重载form元素的action、enctype、method、novalidate与target属性。为fieldset元素增加disabled属性,可以把它的子元素设为disabled状态。 为input、button、form增加novalidate属性,可以取消提交时进行的有关检查,表单可以被无条件地提交。

2、链接相关属性

为a、area增加media属性。规定目标 URL 是为什么类型的媒介/设备进行优化的。该属性用于规定目标 URL 是为特殊设备(比如 iPhone)、语音或打印媒介设计的。该属性可接受多个值。只能在 href 属性存在时使用。 为area增加herflang和rel属性。hreflang 属性规定在被链接文档中的文本的语言。只有当设置了 href 属性时,才能使用该属性。注释:该属性是纯咨询性的。rel 属性规定当前文档与被链接文档/资源之间的关系。只有当使用 href 属性时,才能使用 rel 属性。 为link增加size属性。sizes 属性规定被链接资源的尺寸。只有当被链接资源是图标时 (rel="icon"),才能使用该属性。该属性可接受多个值。值由空格分隔。 为base元素增加target属性,主要是保持与a元素的一致性。

3、其他属性

为ol增加reversed属性,它指定列表倒序显示。 为meta增加charset属性 为menu增加type和label属性。label为菜单定义一个课件的标注,type属性让才当可以以上下文菜单、工具条与列表cande但三种形式出现。 为style增加scoped属性。它允许我们为文档的指定部分定义样式,而不是整个文档。如果使用 "scoped" 属性,那么所规定的样式只能应用到 style 元素的父元素及其子元素。 为script增减属性,它定义脚本是否异步执行。async 属性仅适用于外部脚本(只有在使用 src 属性时)有多种执行外部脚本的方法: 如果 async="async":脚本相对于页面的其余部分异步地执行(当页面继续进行解析时,脚本将被执行) 如果不使用 async 且 defer="defer":脚本将在页面完成解析时执行 如果既不使用 async 也不使用 defer:在浏览器继续解析页面之前,立即读取并执行脚本 为html元素增加manifest,开发离线web应用程序时他与API结合使用,定义一个URL,在这个URL上描述文档的缓存信息。 为iframe增加撒个属性,sandbox、seamless、srcdoc。用来提高页面安全性,防止不信任的web页面执行某些操作。

废除的属性

HTML4中一些属性在HTML5中不再被使用,而是采用其他属性或其他方式进行替代。

在HTML 4中使用的属性 使用该属性的元素 在HTML 5中的替代方案
rev link、a rel
charset link、a 在被链接的资源的中使用HTTP Content-type头元素
shape、coords a 使用area元素代替a元素
longdesc img、iframe 使用a元素链接到校长描述
target link 多余属性,被省略
nohref area 多余属性,被省略
profile head 多余属性,被省略
version html 多余属性,被省略
name img id
scheme meta 只为某个表单域使用scheme
archive、chlassid、codebose、codetype、declare、standby object 使用data与typc属性类调用插件。需要使用这些属性来设置参数时,使用param属性
valuetype、type param 使用name与value属性,不声明之的MIME类型
axis、abbr td、th 使用以明确简洁的文字开头、后跟详述文字的形式。可以对更详细内容使用title属性,来使单元格的内容变得简短
scope td 在被链接的资源的中使用HTTP Content-type头元素
align caption、input、legend、div、h1、h2、h3、h4、h5、h6、p 使用CSS样式表替代
alink、link、text、vlink、background、bgcolor body 使用CSS样式表替代
align、bgcolor、border、cellpadding、cellspacing、frame、rules、width table 使用CSS样式表替代
align、char、charoff、height、nowrap、valign tbody、thead、tfoot 使用CSS样式表替代
align、bgcolor、char、charoff、height、nowrap、valign、width td、th 使用CSS样式表替代
align、bgcolor、char、charoff、valign tr 使用CSS样式表替代
align、char、charoff、valign、width col、colgroup 使用CSS样式表替代
align、border、hspace、vspace object 使用CSS样式表替代
clear br 使用CSS样式表替代
compace、type ol、ul、li 使用CSS样式表替代
compace dl 使用CSS样式表替代
compace menu 使用CSS样式表替代
width pre 使用CSS样式表替代
align、hspace、vspace img 使用CSS样式表替代
align、noshade、size、width hr 使用CSS样式表替代
align、frameborder、scrolling、marginheight、marginwidth iframe 使用CSS样式表替代
autosubmit menu  
HTML / CSS 相关文章推荐
网页布局中CSS样式无效的十个重要原因详解
Aug 10 HTML / CSS
使用before和:after伪类制作css3圆形按钮
Apr 08 HTML / CSS
CSS3提交意见输入框样式代码
Oct 30 HTML / CSS
使用CSS3实现一个3D相册效果实例
Dec 03 HTML / CSS
CSS3 Calc实现滚动条出现页面不跳动问题
Sep 14 HTML / CSS
HTML5移动开发图片压缩上传功能
Nov 09 HTML / CSS
前端canvas水印快速制作(附完整代码)
Sep 19 HTML / CSS
Html5内唤醒百度、高德APP的实现示例
May 20 HTML / CSS
HTML5 的新的表单元素(datalist/keygen/output)使用介绍
Jul 19 HTML / CSS
探索HTML5本地存储功能运用技巧
Mar 02 HTML / CSS
HTML5不支持标签和新增标签详解
Jun 27 HTML / CSS
配置H5的滚动条样式的示例代码
Mar 09 HTML / CSS
HTML5中微数据概述及在搜索引擎中的使用举例
Feb 07 #HTML / CSS
HTML中fieldset标签概述及使用方法
Feb 01 #HTML / CSS
HTML5之WebGL 3D概述(下)—借助类库开发及框架介绍
Jan 31 #HTML / CSS
HTML5之WebGL 3D概述(上)—WebGL原生开发开启网页3D渲染新时代
Jan 31 #HTML / CSS
HTML5之HTML元素扩展(下)—增强的Form表单元素值得关注
Jan 31 #HTML / CSS
HTML5之HTML元素扩展(上)—新增加的元素及使用概述
Jan 31 #HTML / CSS
突袭HTML5之Javascript API扩展5—其他扩展(应用缓存/服务端消息/桌面通知)
Jan 31 #HTML / CSS
You might like
Discuz 模板语句分析及知识技巧
2009/08/21 PHP
超级实用的7个PHP代码片段分享
2012/01/05 PHP
跟我学Laravel之配置Laravel
2014/10/15 PHP
PHP引用的调用方法分析
2016/04/25 PHP
laravel 配置路由 api和web定义的路由的区别详解
2019/09/03 PHP
编辑浪子版表单验证类
2007/05/12 Javascript
基于jquery自己写tab滑动门(通用版)
2012/10/30 Javascript
js时间比较示例分享(日期比较)
2014/03/05 Javascript
jquery无法设置checkbox选中即没有变成选中状态
2014/03/27 Javascript
JavaScript对象之深度克隆介绍
2014/12/08 Javascript
JQuery中Bind()事件用法分析
2015/05/05 Javascript
js控制文本框输入的字符类型方法汇总
2015/06/19 Javascript
原生JavaScript实现异步多文件上传
2015/12/02 Javascript
Vue.JS实现垂直方向展开、收缩不定高度模块的JS组件
2018/06/19 Javascript
使用p5.js临摹动态图片
2019/11/04 Javascript
vue实现抽屉弹窗效果
2020/11/15 Javascript
Vue 打包的静态文件不能直接运行的原因及解决办法
2020/11/19 Vue.js
[45:52]2018DOTA2亚洲邀请赛 4.1小组赛 A组加赛 LGD vs Liquid
2018/04/02 DOTA
打开电脑上的QQ的python代码
2013/02/10 Python
浅析Python多线程下的变量问题
2015/04/28 Python
python实现百万答题自动百度搜索答案
2018/01/16 Python
windows下python安装小白入门教程
2018/09/18 Python
Python shelve模块实现解析
2019/08/28 Python
Python爬虫爬取杭州24时温度并展示操作示例
2020/03/27 Python
薇姿法国官网:Vichy法国
2021/01/28 全球购物
PHP中如何使用Cookie
2015/10/28 面试题
php优化查询foreach代码实例讲解
2021/03/24 PHP
航空大学应届生求职信
2013/11/10 职场文书
打架检讨书500字
2014/01/29 职场文书
考试作弊检讨书大全
2014/02/18 职场文书
机械设计专业大学生职业生涯规划书范文
2014/09/13 职场文书
2015年小学英语教师工作总结
2015/05/12 职场文书
2015年助理政工师工作总结
2015/05/26 职场文书
2016年公司中秋节致辞
2015/11/26 职场文书
如何在centos上使用yum安装rabbitmq-server
2021/03/31 Servers
HTML中实现音乐或视频自动播放案例详解
2022/05/30 HTML / CSS