鍍金池/ 教程/ HTML/ HTML5 屬性
HTML5 Web 存儲
HTML5 Web SQL 數(shù)據(jù)庫
HTML5 字符編碼
HTML5 URL 編碼
HTML5 Modernizr
HTML5 快速指南
HTML5 畫布
HTML5 語法
HTML5 顏色代碼生成器
HTML5 音頻和視頻
HTML5 微數(shù)據(jù)
HTML5 標(biāo)簽參考
HTML5 在線編輯器
HTML5 表單 2.0
HTML5 概述
HTML5 SVG 教程
HTML5 驗(yàn)證
有用的 HTML5 資源
HTML5 字體參考
HTML5 屬性
HTML5 新標(biāo)簽(元素)
HTML5 地理定位
HTML5 拖放
HTML5 字符實(shí)體參考
HTML5 Web Workers
HTML5 過時(shí)標(biāo)簽和屬性
HTML5 顏色名稱
HTML5 WebSockets 教程
HTML5 服務(wù)器推送事件
HTML5 事件
HTML5 MathML 教程

HTML5 屬性

正如 HTML5 語法中所闡述的,元素可以包含屬性(attributes)給一個(gè)元素設(shè)置各種屬性(properties)。

有些屬性被定義為全局的,可以用在任何元素上,而其他的被定義為元素特有的。所有的屬性都有一個(gè)名稱和一個(gè)值,看起來如下面的示例所示。

下面是一個(gè)使用 HTML5 屬性的例子,演示了如何用名為 class 的屬性和值 “example” 標(biāo)記一個(gè) div 元素:

<div class="example">...</div>

屬性只能在起始標(biāo)簽中指定,絕對不能用在結(jié)束標(biāo)簽中。

HTML5 屬性不區(qū)分大小寫,可以全部大寫或者混合使用,盡管最常見的約定是始終使用小寫。

標(biāo)準(zhǔn)屬性

下面列出的屬性幾乎所有的 HTML5 標(biāo)簽都支持。

屬性 選項(xiàng) 功能
accesskey 用戶自定義 定義訪問元素的鍵盤快捷鍵。
align right, left, center 水平對齊標(biāo)簽。
background URL 在元素后面設(shè)置一個(gè)背景圖像。
bgcolor 數(shù)值,十六進(jìn)制值,RGB值 在元素后面設(shè)置一個(gè)背景顏色。
class 用戶定義。 分類一個(gè)元素,便于使用級聯(lián)樣式表。
contenteditable true, false 定義用戶是否可以編輯元素的內(nèi)容。
contextmenu Menu id 為元素定義上下文菜單。
data-XXXX 用戶定義。 自定義屬性。 HTML 文檔的作者可以定義自己的屬性。 自定義屬性必須以 "data-" 開頭。
draggable true,false, auto 定義用戶是否可以拖動元素。
height 數(shù)字值 定義表格,圖像或表格單元的高度。
hidden hidden 定義元素是否應(yīng)該可見。
id 用戶定義。 命名元素,便于使用級聯(lián)樣式表。
item 元素列表。 用于組合元素。
itemprop 條目列表。 用于組合條目。
spellcheck true, false 定義元素是否必須有拼寫或錯誤檢查。
style CSS 樣式表。 給元素定義內(nèi)聯(lián)樣式。
subject 用戶定義 id。 定義元素關(guān)聯(lián)的條目。
tabindex Tab number 定于元素的 tab 鍵順序。
title 用戶定義。 元素的“彈出”標(biāo)題。
valign top, middle, bottom HTML 元素內(nèi)標(biāo)簽的垂直對齊方式。
width 數(shù)字值。 定義表格,圖像和表格單元的寬度。

完整的 HTML5 標(biāo)簽列表以及相關(guān)的屬性請參考 HTML5 標(biāo)簽。

自定義屬性

HTML5 還引入了一個(gè)新特性,就是可以添加自定義的數(shù)據(jù)屬性。

自定義數(shù)據(jù)屬性以 data- 開頭,基于我們的需求命名。下面是一個(gè)簡單的例子:

<div class="example" data-subject="physics" data-level="complex">
...
</div>

上面的例子中兩個(gè)叫做 data-subjectdata-level 的自定義屬性在 HTML5 中是完全有效的。我們還可以使用 JavaScript API 或者在 CSS 中以獲取標(biāo)準(zhǔn)屬性類似的方式獲取它們的值。

上一篇:HTML5 快速指南下一篇:HTML5 概述