id和class是HTML元素中兩個最基本的公共屬性。
id屬性被賦予了標識頁面元素的唯一身份。如果一個頁面出現了多個相同id屬性取值，CSS選擇器或者JavaScript就會因為無法分辨要控制的元素而最終報錯。
舉例：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link href="css/css_reset.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="first"> 學習網</div>
<p id="first"> 學習網</p>
</body>
</html>
說明：
上面HTML代碼是錯誤的，因為在同一個HTML頁面中，不允許出現兩個相同的id。不過要注意一下，在不同頁面是可以出現相同id的元素。
class，顧名思義，就是“類”。它采用的思想跟其他C、Java等編程語言的“類”相似。我們可以為同一個頁面的相同元素或者不同元素設置相同的class，然後使得相同的class具有相同的CSS樣式。
如果你要為兩個元素或者兩個以上元素定義相同的樣式，建議使用class屬性。
舉例：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link href="css/css_reset.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="first"> 學習網</div>
<p class="first"> 學習網</p>
</body>
</html>
說明：
這段HTML代碼是正確的，因為在同一個HTML頁面中，允許相同的元素或者不同的元素設置相同的class屬性，以便我們可以統一對具有相同的class屬性的元素定義相同的CSS樣式。
id和class就像你的身份證號和姓名，身份證號是全國唯一的，id號也就是唯一的，class（類名）就是姓名，兩個人的姓名就有可能一樣。
此外，需要注意一下：