HTML中的標(biāo)簽屬性可以賦予標(biāo)簽更多的信息，屬性總是以key :value即名稱/值對(duì)的形式出現(xiàn)。屬性可分為全局屬性與私有屬性，全局屬性是指所有HTML標(biāo)簽都可以使用，而私有屬性是針對(duì)部分標(biāo)簽設(shè)置的；下面分別從標(biāo)簽全局屬性、私有屬性和事件屬性這三個(gè)維度進(jìn)行介紹。
標(biāo)簽全局屬性
標(biāo)簽全局屬性常見(jiàn)的有：class、id、style、title、dir、lang以及HTML5新增的屬性draggable、dragzone、hidden、spellcheck等屬性，更詳細(xì)的信息可以查看HTML全局屬性。
代碼示例
<div class = "divExample" id = "divOnly" style="width:10px ; color:#fefefe"></div>
class屬性
class屬性規(guī)定元素的類(lèi)名，每個(gè)元素可以被賦予一個(gè)或多個(gè)類(lèi)，多個(gè)元素可以共享一個(gè)類(lèi)，類(lèi)名最好不要以數(shù)字開(kāi)頭。
class 屬性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title
代碼示例
<h1 class="intro important">Header 1</h1>
h1.intro
{
color:blue;
text-align:center;
}
.important {background-color:yellow;}
id屬性
id屬性規(guī)定元素唯一的id，id在文檔中必須是唯一的，不能重復(fù)，id屬性可以作為鏈接錨，通過(guò)js或css為帶有id的元素指定樣式
代碼示例
<p id="exp">內(nèi)容示例 1</p>
#exp{
color:#fefefe;
font-size:10px;
}
style屬性
style屬性規(guī)定元素的行內(nèi)樣式，優(yōu)先級(jí)最高，將會(huì)覆蓋任何全局的樣式設(shè)定。
代碼示例
<p style="color:red;font-size:10px">內(nèi)容示例2</p>
標(biāo)簽私有屬性
不同的標(biāo)簽會(huì)有自己的私有屬性，比如<a>標(biāo)簽的href屬性，<img>標(biāo)簽的src屬性等，接下來(lái)我將對(duì)常用標(biāo)簽的私有屬性作詳細(xì)的介紹
a標(biāo)簽私有屬性
<a>標(biāo)簽屬性有：href、target、download、hreflang、media、 rel、target 以及 type等屬性，詳細(xì)可參考a標(biāo)簽屬性。我們此處只詳細(xì)介紹href、target等屬性
1. href屬性
href屬性指示鏈接的目標(biāo)網(wǎng)址，網(wǎng)址可以是絕對(duì)網(wǎng)址或相對(duì)網(wǎng)址；如果不給<a>標(biāo)簽添加href屬性，則download, hreflang, media, rel, target 以及 type屬性不可用。
<a >百度一下</a><a >百度一下</a>
2. target屬性
target屬性規(guī)定在何處打開(kāi)鏈接文檔，屬性對(duì)應(yīng)的值有_blank、_parent、_top、_self、framename。
_blank：在新窗口中打開(kāi)被鏈接文檔；
_parent：在父框架集中打開(kāi)被鏈接文檔；
_top：在整個(gè)窗口中打開(kāi)被鏈接文檔；
_self：默認(rèn),在相同的框架中打開(kāi)被鏈接文檔；
framename：在指定的框架中打開(kāi)被鏈接文檔。
代碼示例
<a target="_blank">百度一下</a>
3. CSS偽類(lèi)為<a>標(biāo)簽添加樣式
a:link鏈接未被訪問(wèn)時(shí)添加的樣式
a:hover鼠標(biāo)懸浮在鏈接上時(shí)添加的樣式
a:active鏈接被點(diǎn)擊時(shí)添加的樣式
a:visited鏈接訪問(wèn)時(shí)添加的樣式
代碼示例
<a target="_blank">百度一下</a>
a:link {color: #FF0000}
a:visited {color: #00FF00}
a:hover {color: #FF00FF}
a:active {color: #0000FF}
img標(biāo)簽
<img>標(biāo)簽具有的屬性有src和alt，可選的屬性有height、width、ismap等
1. src屬性
src屬性規(guī)定顯示圖像的url，分為絕對(duì)鏈接與相對(duì)鏈接，具體可參考圖片路徑。
2. alt屬性
alt屬性規(guī)定圖像的替代文本，在圖像無(wú)法顯示時(shí)或圖片禁止顯示時(shí)，可用文本代替顯示。
代碼示例
<img src="" alt="圖片信息" width="10px" heigth="10px"/>
input標(biāo)簽
- 標(biāo)簽類(lèi)型
<input>標(biāo)簽類(lèi)型有：button、checkbox、file、hidden、image、password、radio、reset、submit、text以及HTML5新增的類(lèi)型email url、number、range、Date pickers (date, month, week, time, datetime, datetime-local)、search、color。
我的上一篇文章HTML 基礎(chǔ)知識(shí)及HTML5總結(jié)
對(duì)input標(biāo)簽原有類(lèi)型進(jìn)行了介紹，這篇文章主要對(duì)HTML5新增標(biāo)簽類(lèi)型進(jìn)行介紹。
- email類(lèi)型
email 類(lèi)型用于應(yīng)該包含 e-mail 地址的輸入域，在提交表單時(shí)，會(huì)自動(dòng)驗(yàn)證 email 域的值。
代碼示例郵箱: <input type="email" name="user_email" /> - url類(lèi)型
url類(lèi)型用于應(yīng)該包含 URL 地址的輸入域，在提交表單時(shí)，會(huì)自動(dòng)驗(yàn)證 url 域的值。
代碼示例網(wǎng)址輸入: <input type="url" name="url_input" /> - number類(lèi)型
number類(lèi)型用于應(yīng)該包含數(shù)值的輸入域。屬性有max、min、step、min。
max表示輸入數(shù)字的最大值，min表示輸入數(shù)字的最小值，step表示輸入數(shù)字之間的間隔，value表示初始顯示值
代碼示例
<input type="number" max="12" min = "0" step ="3" value = "6"> - range 類(lèi)型
range 類(lèi)型用于應(yīng)該包含一定范圍內(nèi)數(shù)字值的輸入域，range 類(lèi)型顯示為滑動(dòng)條。range類(lèi)型的屬性與number類(lèi)型一致。
代碼示例：
<input type="range" max="12" min = "0" step ="3" value = "6"> - Date pickers類(lèi)型
HTML5 擁有多個(gè)可供選取日期和時(shí)間的新輸入類(lèi)型：- date - 選取日、月、年
- month - 選取月、年
- week - 選取周和年
- time - 選取時(shí)間（小時(shí)和分鐘）
- datetime - 選取時(shí)間、日、月、年（UTC 時(shí)間）
- datetime-local - 選取時(shí)間、日、月、年（本地時(shí)間）
代碼示例：<input type="week" name="user_date" />
- input標(biāo)簽屬性
<input>標(biāo)簽屬性有type、name、value、readonly、disabled以及HTML5新增屬性placeholder、formmethod、formtarget、list、step等屬性
-
type定義input類(lèi)型，上一章節(jié)已經(jīng)做過(guò)詳細(xì)的介紹。 -
name定義input元素的名稱 -
value定義input元素的值 -
readonly規(guī)定input元素輸入值為只讀的，但input元素的事件屬性都正常使用 -
disabled規(guī)定input元素加載時(shí)禁用，包括事件屬性 -
placeholder規(guī)定input元素的提示信息 -
list表示引用包含輸入字段的預(yù)定義選項(xiàng)的 datalist -
formmethod覆蓋表單的method屬性，有get和post備選值，適用于submit、image類(lèi)型標(biāo)簽 -
formtarget覆蓋表單的 target 屬性
代碼示例
<datalist id="url_list">
<option label="百度一下" value="http://www.baidu.com" />
<option label="北郵人論壇" value="http://www.bbs.byr.cn" />
<option label="愛(ài)奇藝" value="http://www.iqiyi.com" />
</datalist>
事件屬性
HTML事件包含Windows事件、Form事件、Keybord事件、Mouse事件和Media事件
- Windows事件是針對(duì)Windows對(duì)象觸發(fā)的時(shí)間，應(yīng)用于
<body>標(biāo)簽。 - Form事件是由HTML表單內(nèi)的動(dòng)作觸發(fā)，幾乎所有HTML元素都具有表單時(shí)間屬性，但一般多用于表單元素。
- Keybord事件即鍵盤(pán)事件，用戶通過(guò)操作鍵盤(pán)觸發(fā)鍵盤(pán)事件。
- Mouse事件即鼠標(biāo)事件，由鼠標(biāo)或用戶類(lèi)似動(dòng)作觸發(fā)。
- Media事件是由媒介如視頻、音頻等觸發(fā)的事件，適用于所有 HTML 元素，但常見(jiàn)于媒介元素中，比如
<audio>、<embed>、<img>、<object> 以及 <video>等元素。
w3cschool對(duì)時(shí)間屬性盡心了詳細(xì)的介紹，點(diǎn)擊參考。
