html查漏补缺

HTML全局属性

全局属性是所有HTML元素共有的属性，它们可以用于所有元素，即使属性可能对某些元素不起作用

属性	描述
accesskey	规定激活元素的快捷键
class	规定元素的一个或多个类型（引用样式表中的类）
contenteditable	规定元素内容是否可编辑
contextmenu	规定元素的上下文菜单。上下文菜单在用户点击元素时显示
data-*	用于存储页面或应用程序的私有定制数据
dir	规定元素中内容的文本方向
draggable	规定元素是否可拖动
hidden	隐藏元素
id	规定元素的唯一 Id
lang	规定元素内容的语言
spellcheck	规定是否对元素进行拼写和语法检查
style	规定元素的行内CSS样式
tabindex	规定元素的tab键次序
title	规定有关元素的额外信息
translate	规定是否应该翻译元素内容(值为 yes 或 no)

详解

data-*

data-* 属性赋予我们在所有 HTML 元素上嵌入自定义 data 属性的能力。存储的数据能够被 JS 拿到，而不必进行 Ajax 调用或服务器数据库查询
** 用户代理会完全忽略前缀为 data- 的自定义属性

data-* 属性名不能包含任何大写字母，属性值可以是任意字符串
用来嵌入自定义数据，如：

<ul>
  <li data-animal-type='鸟类'>喜鹊</li>
  <li data-animal-type="鱼类">金枪鱼</li>
  <li data-animal-type="蜘蛛">蝇虎</li>
</ul>

draggable

规定元素是否可拖动。（链接和图像默认是可以拖动的）

1
2
3

<p draggable='true'>这段文字可以拖动</p>
<!-- 改属性是枚举属性，不是布尔属性，所以不能使用下面的写法 -->
<p draggable>这段文字可以拖动</p>

tabindex

规定元素的 tab 键控制次序（当 tab 键用于导航是）

1
2
3

<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a>
<a href="http://www.google.com/" tabindex="1">Google</a>
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>

怪异模式和标准模式

目前浏览器的排版引擎使用三种模式：怪异模式（Quirks mode）、接近标准模式（Almost standards mode）、标准模式（Standards mode）
在怪异模式下，排版会模拟 Navigator 4 与 IE5 的非标准行为
在标准模式下，行为即由 HTML 与 CSS 的规范描述的行为
在接近标准模式下，只有少数的怪异行为被实现

对HTML文件来说，浏览器使用文件开头的 DOCTYPE 来决定用怪异模式处理还是标准模式处理