HTML5终极备忘大全(图片版+文字版)
一、前言兼图片备忘
下图是我从testking网站上的Ultimate HTML5 Cheatsheat这篇文章中备忘图片(已大小优化,因为图片较高,故滚动显示)。
但是,上面毕竟是图片格式(原图上兆),而且还是英文的,所以自己觉得有必要将上面的内容文字化,同时做下简单的中文翻译。整理一番,于是就有下面的些内容。
二、文字备忘之标签
| article> | 定义文章 |
|---|---|
| aside> | 定义页面内容旁边的内容 |
| audio> | 定义声音内容 |
| canvas> | 定义图形 |
| command> | 定义一个控制按钮 |
| datagrid> | 指树或表格状数据格式中的动态数据 |
| datalist> | 定义一个下拉列表 |
| details> | 定义一个元素的细节 |
| diaLOG> | 定义会话或人的交谈 |
| embed> | 定义额外的交互内容或插件 |
| figcaption> | 定义指定元素的标题 |
| figure> | 定义一组媒体内容,以及他们的标题 |
| footer> | 为章节或页面定义一个底部 |
| header> | 为章节或页面定义一个头部 |
| hgroup> | 定义文档中某段落的信息 |
| keygen> | 定义表单生成的关键 |
| mark> | 定义被标记的文本 |
| meter> | 定义预定义范围内的测量 |
| nav> | 定义导航链接 |
| output> | 定义某种类型的输出 |
| PRogress> | 定义任意种类任务的进程 |
| rp> | 定义浏览器不支持ruby元素的替代者 |
| rt> | 定义ruby注释的解释 |
| ruby> | 定义 ruby 注释(中文注音或字符)。 |
| section> | 定义章节 |
| source> | 定义媒体资源 |
| summary> | 定义某"detail"元素的头部 |
| time> | 定义日期/时间 |
| video> | 定义视频 |
| wbr> | 定义可能的换行 |
| !– …–> | 定义注释 |
|---|---|
| !DOCTYPE> | 定义文档类型 |
| a> | 定义超链接 |
| abbr> | 定义缩写 |
| address> | 定义地址元素 |
| area> | 定义图片地图的某区域 |
| b> | 定义加粗文字 |
| base> | 定义整个页面的基础URL |
| bdo> | 定义文本显示的方向 |
| blockquote> | 定义一个长引用 |
| body> | 定义主体元素 |
| br> | 插入单个的换行 |
| button> | 定义按钮 |
| caption> | 定义表格的标题 |
| cITe> | 定义引用 |
| code> | 定义计算机代码文本 |
| col> | 定义表格列的属性 |
| colgroup> | 定义表格列的组 |
| dd> | 定义个定义描述 |
| del> | 定义删除文本 |
| DFn> | 定义个定义项 |
| div> | 定义文档章节 |
| dl> | 定义定义列表 |
| dt> | 定义定义项 |
| em> | 定义强调文本 |
| fieldset> | 定义控件组 |
| form> | 定义表单 |
| h1> 到h6> | 定义头部1到头部6 |
| head> | 定义文档信息 |
| hr> | 定义水平线 |
| html> | 定义个html文档 |
| i> | 定义倾斜文本 |
| iframe> | 定义内联替代窗口(框架) |
| img> | 定义个图片 |
| input> | 定义输入域 |
| ins> | 定义插入文本 |
| kbd> | 定义键盘文本 |
| label> | 定义表单控件的标签 |
| legend> | 定义控件组的标题 |
| li> | 定义列表项 |
| link> | 定义相关资源 |
| map> | 定义图片地图 |
| menu> | 定义菜单列表 |
| meta> | 定义元信息 |
| noscript> | 定义无脚本章节 |
| object> | 定义内嵌对象 |
| ol> | 定义一个有序列表 |
| optgroup> | 定义个选项组 |
| option> | 定义下拉列表选项 |
| p> | 定义段落 |
| params> | 定义object的参数 |
| pre> | 定义预格式化文本 |
| q> | 定义短引用 |
| s> | 定义不再正确的文本 |
| samp> | 定义简单的计算机代码 |
| script> | 定义脚本 |
| select> | 定义可选择列表 |
| small> | 定义小点的文本 |
| span> | 定义文档章节 |
| strong> | 定义强调的文字 |
| style> | 定义一个样式定义 |
| sub> | 定义下标文字 |
| sup> | 定义上标文字 |
| table> | 定义表格 |
| tbody> | 定义表格的主体 |
| td> | 定义表格单元格 |
| textarea> | 定义文本域 |
| tfoot> | 定义表格底部 |
| th> | 定义表格头 |
| thead> | 定义表格头 |
| title> | 定义文档的标题 |
| tr> | 定义表格行 |
| ul> | 定义无序列表 |
| VAR> | 定义变量 |
| acronym> | 在HTML4.01中定义首字母缩略词 |
|---|---|
| applet> | 定义内嵌的小应用程序 |
| basefont> | 定义文档中基本的字体属性 |
| Big> | 让文字变大点 |
| center> | 居中显示文字或内容 |
| dir> | 定义目录列表 |
| font> | 指定字体种类,大小,颜色等 |
| frame> | 在框架集中定义独有的窗体 |
| frameset> | 定义框架集,包含多个窗体 |
| noframe> | 当浏览器不支持框架的时候显示文字 |
| strike> | 定义删除线文本 |
| tt> | 定义电传打字机文本 |
| u> | 定义下划线文字 |
| XMp> | 定义格式化的文字 |
三、HTML5文字备忘之全局属性
| contenteditable | 指定是否允许用户编辑内容 true | false |
|---|---|
| contextmenu | 定义元素的上下文菜单 menu id |
| Draggable | 指定是否允许用户拖拽元素 true|false|auto |
| dropzone | 指定当拖拽数据放开的时候会发生什么 copy|move|link |
| hidden | 指定元素不相干 hidden |
| spellcheck | 指定是否元素要进行拼写检查 true | false |
| accesskey | 指定访问元素的快捷键 字符(character) |
|---|---|
| class | 指定元素的类名(为样式表) 类名(classname) |
| dir | 指定元素文本内容的对齐方向 ltr|rtl |
| id | 为元素指定唯一的id id |
| lang | 为元素内容指定语言代码 语言代码(language code) |
| style | 指定元素的内联样式 样式定义(style definition) |
| tabindex | 指定元素的tab顺序 数值(nubmer) |
| title | 指定元素额外的信息 文本(text) |
四、HTML5文字备忘之事件属性
1. window对象
| onafterprint | 在文档打印之后执行 |
|---|---|
| onbeforeprint | 在文档打印之前执行 |
| onbeforeloaded | 在文档加载完毕之前执行 |
| onerror | 当错误发生时执行 |
| onhaschange | 当文档发生改变的时候执行 |
| onmessage | 当该信息被触发的时候执行 |
| onoffline | 当文档离线的时候执行 |
| ononline | 当文档上线的时候执行 |
| onpagehide | 当窗体隐藏的时候执行 |
| onpageshow | 当窗体显示的时候执行 |
| onpopstate | 当窗体历史改变的时候执行 |
| onredo | 当文档执行恢复上一次操作的时候执行 |
| onresize | 当窗体大小改变的时候执行 |
| onstorage | 当文档加载ok的时候执行 |
| onondo | 当文档执行恢复之前一次操作的时候执行 |
| onunload | 当用户离开文档的时候执行 |
| onblur | 当窗体失去焦点的时候执行 |
|---|---|
| onfocus | 当窗体获得焦点的时候执行 |
| onload | 当文档加载完毕的时候执行 |
2. form表单的事件属性
| oncontextmenu | 当上下文菜单被触发的时候执行 |
|---|---|
| onformchange | 当表单发生改变的时候执行 |
| onforminput | 当表单获得用户输入时候执行 |
| oninput | 当元素获得用户输入的时候执行 |
| oninvalid | 当元素验证无效的时候执行 |
| onblur | 当元素失去焦点的时候执行 |
|---|---|
| onchange | 当元素改变的时候执行 |
| onfocus | 当元素获得焦点的时候执行 |
| onselect | 当元素被选择的时候执行 |
| onsubmit | 当表单被提交的时候执行 |
| onreset | 当表单重置的时候执行 |
|---|
3. 键盘事件
| onkeydown | 当键按下的时候执行 |
|---|---|
| onkeypress | 当键按下并释放的时候执行 |
| onkeyup | 当键抬起的时候执行 |
4. 鼠标事件
| ondrag | 当元素被拖拽的时候执行 |
|---|---|
| ondragend | 当元素拖拽操作结束的时候执行 |
| ondragenter | 当元素拖拽进入释放对象的时候 |
| ondragleave | 当元素拖拽离开释放对象的时候 |
| ondragover | 当元素拖拽经过释放对象的时候 |
| ondragstart | 当元素拖拽操作开始的时候执行 |
| ondrop | 当拖拽元素被放开的时候 |
| onmouswheel | 当鼠标滑轮滚动的时候执行 |
| onscroll | 当元素的滚动条滚动的时候执行 |
| onclick | 当鼠标点击的时候执行 |
|---|---|
| ondbclick | 当鼠标双击的时候执行 |
| onmousedown | 当鼠标按下的时候执行 |
| onmouSEMove | 当鼠标移动的时候执行 |
| onmouseout | 当鼠标移出元素的时候执行 |
| onmouseover | 当属性进入元素的时候执行 |
| onmouseup | 当鼠标抬起的时候执行 |
5. 媒体事件
| oncanplay | 当媒体可以播放的时候执行 |
|---|---|
| oncanplaythrough | 当媒体可以播放到最后的时候执行 |
| ondurationchange | 当媒体长度改变的时候执行 |
| onemptied | 当媒体资源元素变成空的时候执行 |
| onended | 当媒体已经到达最后的时候执行 |
| onerror | 当加载元素发生错误的时候执行 |
| onloadeddata | 当媒体数据加载完毕的时候执行 |
| onloadedmetadata | 当媒体元素的持续时间加载完毕的时候执行 |
| onloadstart | 当浏览器开始加载媒体数据的时候执行 |
| onpause | 当媒体数据暂停的时候执行 |
| onplay | 当媒体数据继续开始播放的时候执行 |
| onplaying | 当媒体数据已经开始播放的时候执行 |
| onprogress | 在浏览器正在获取媒体数据的时候执行 |
| onratechange | 当媒体数据播放比率发生改变的时候执行 |
| onreadystatechange | 当ready-state发生改变的时候执行 |
| onseeked | 当元素的seeking属性不是true的时候执行 |
| onseeking | 当元素的seeking属性是true的时候执行 |
| onstalled | 当获取元素数据发生错误的时候执行 |
| onsuspend | 当浏览器停止获取媒体数据的时候执行 |
| ontimeupdate | 当媒体改变其播放位置的时候执行 |
| onvolumechange | 当媒体音量大小发生改变的时候执行,包括无声 |
| onwaiting | 当媒体元素停止播放的时候 |
| onabort | 碰到abort的时候执行 |
|---|
五、HTML5文字备忘之浏览器的准备情况
支持:
不支持:
部分支持:
注:下表格最右侧三栏指移动设备上的浏览器支持情况。
| 8 | 3.6 | 9.0 | 5.0 | 11.0 | 2.3 | 4.5 | 10.0 | ||
|---|---|---|---|---|---|---|---|---|---|
| Details & Summary元素 | |||||||||
| WebGL – 3D Canvas 制图 | |||||||||
| HTML5中内联SVG | |||||||||
| Datalist元素 | |||||||||
| Progress & Meter | |||||||||
| classList(DOMTokenList) | |||||||||
| Ruby注解 | |||||||||
| 表单验证 | |||||||||
| Session历史管理 | |||||||||
| HTML5表单特征 | |||||||||
| 拖拽和拖放 | |||||||||
| contenteditable属性 | |||||||||
| Canvas的文本API | |||||||||
| Audio元素 | |||||||||
| Video元素 | |||||||||
| dataset & data – 属性 | |||||||||
| 新语义元素 | |||||||||
| Canvas(基本支持) | |||||||||
| Hash改变事件 | |||||||||
| 离线web应用程序 | |||||||||
| getElementsByClassName | |||||||||
| 总支持率 | 21% | 55% | 85% | 67% | 64% | 51% | 50% | 36% |
六、最后几句话
时间仓促,错误难免。欢迎大力指正。以上就是全部内容。
参考文章:UltiMATE HTML5 Cheatsheat [Infographic]
(本篇完)
觉得可用,就经常来吧! 欢迎评论哦! html5教程,巧夺天工,精雕玉琢。小宝典献丑了!
声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!
若转载请注明出处: HTML5终极备忘大全(图片版+文字版)
本文地址: https://pptw.com/jishu/586982.html
