局部屬性：有些元素能規定自己的屬性，這種屬性稱為局部屬性。 比如 link 元素，它具有的局部屬性有 href、 rel、 hreflang、 media、 type、 sizes 這六個。 全局屬性：可以用來配置所有元素共有的行為，這種屬性稱為全局屬性，可以用在任何一個元素身上。
1、accesskey 屬性
使用 accesskey 屬性可以設定一個或幾個用來選擇頁面上的元素的快捷鍵。
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta > <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>HTML全局屬性測試</title> </head> <body> <form action=""> <p> Name: <input type="text" > </p> <p> Password: <input type="password" > </p> <p> Name: <input type="submit" > </p> </form> </body> </html>
在上面的例子中，三個 input 元素添加了 accesskey 屬性，這樣在 Mac 下就可以用 Control + Alt(Option) + n快捷鍵訪問到 Name 的輸入框了。用來觸發 accesskey 機制的按鍵組合因平台而異，具體如下：
| 瀏覽器 / 平台 | Window | Linux | Mac |
|---|---|---|---|
| Firefox | Alt + Shift + key | Alt + Shift + key | Control + Alt + key |
| Internet Explorer | Alt + key | N/A | N/A |
| Google Chrome | Alt + key | Alt + key | Control + Alt + key |
| Safari | Alt + key | N/A | Control + Alt + key |
| Opera | 同 Google Chrome | 同 Google Chrome | 同 Google Chrome |
關於 accesskey 這個全局屬性的詳解，可以看一下 HTML accesskey 屬性與 web 自定義鍵盤快捷訪問
2、class 屬性
class 屬性用來將元素歸類，這個就無需多言了。
3、contenteditable 屬性
contenteditable 是 HTML5 中新增加的屬性，，其用途是讓用戶能夠修改頁面上的內容。
<body> <!-- contenteditable屬性應用 --> <p contenteditable="true">設置為 true 是可編輯的</p> </body>
如上例，p 元素的 contenteditable 屬性值設置為 true 時，用戶可以單擊文字編輯內容。設置為 false 時禁止編輯。
4、dir 屬性
dir 屬性用來規定元素中文字的方向。有效值有兩個：ltr(從左到右)、rtl(從右到左)。
<!-- dir屬性應用 --> <p dir="ltr">從左到右</p> <p dir="rtl">從右到左</p>
5、draggable 屬性
draggable 屬性是 HTML5 支持拖放操作的方式之一，用來表示元素是否可被拖放。
6、dropzone 屬性
dropzone 屬性是 HTML5 支持拖放操作的方式之一，與 draggable 屬性搭配使用。
7、id 屬性
id 屬性用來給元素分配一個唯一的標識符。這個也無需多言。需要說明的一點是，id 屬性還可以用來導航到文檔中的特定位置。
8、hidden 屬性
hidden 是個布爾屬性，表示相關元素當前不需要關注，瀏覽器對它的處理方式是隱藏相關元素（隱隱想起來控制一個元素的展示隱藏的時候，會自定義一個 hidden 類，然后在里面寫隱藏樣式），具體也可以看一下這篇介紹 HTML5 的 hidden 屬性
<!-- hidden屬性應用 --> <div hidden>這個元素將會被隱藏</div>
9、lang 屬性
lang 屬性用於說明元素內容使用的語言。lang 屬性必須使用有效的 ISO 語音代碼，使用這個屬性的目的在於，讓瀏覽器調整其表達元素內容的方式，比如在使用了文字朗讀器的情況下正確發音。
<!-- lang屬性應用 --> <p lang="en">Hello - how are you?</p>
10、spellcheck 屬性
spellcheck 屬性用來表明瀏覽器是否應該對元素的內容進行拼寫檢查，這個屬性只有用在用戶可以編輯的元素上時才有意義。 spellcheck 屬性可以接受的值有兩個：true 和 false。至於拼寫檢查的實現方式則因瀏覽器而異。
<!-- spellcheck屬性應用 --> <textarea >This is some lalalala text</textarea>
11、style 屬性
style 屬性用來直接在元素身上定義 CSS 樣式，這個也不做過多描述了。
12、tabindex 屬性
HTML 頁面的鍵盤焦點可以通過按 Tab 鍵在各元素之間切換。用 tabindex 屬性可以改變默認的轉移順序。
<!-- tabindex屬性應用 --> <form action=""> <label>Name: <input type="text" ></label> <label>City: <input type="text" ></label> <label>Country: <input type="text" ></label> <input type="submit" value="" tabindex="3"> </form>
上面的代碼實現效果是：在按 Tab 鍵的過程中，tabindex 為 1 的 Country 輸入框第一個被選中，接着焦點會跳到 Name 輸入框，最后是 submit 提交。tabindex 設置為 - 1 的元素不會在用戶按下 Tab 鍵后被選中。
13、title 屬性
title 屬性提供了元素的額外信息，瀏覽器通常用這些東西顯示工具條提示，這個在一些展示不全的文本標題也經常使用。
<!-- title屬性應用 --> <a href="https://qiqihaobenben.github.io/" title="我的個人網站">qiqihaobenben.github.io</a>
14、contextmenu 屬性
自定義鼠標右鍵彈出菜單內容
15、data-* 屬性
為元素增加自定義屬性
16、translate 屬性
元素和子孫節點內容是否需要本地化
原文：https://segmentfault.com/a/1190000012419902 有部分修改