id
<p id=”footer”>這是用 ID 選擇器的例子。</p>
1.每個HTML元素都可以使用id屬性。2.它的作用是在頁面的所有元素中,將某個元素獨立辨識出來。3.他的值必須以字母或下滑線做開頭(不能使用數字或任何字元)4.同一個頁面上的兩個元素不能有相同的id屬性值(否則該值就不是唯一)5.透過js,id屬性可以讓程式碼與該特定元素互動。6.id屬性是全域屬性(global attribute),因為他可以用在任何元素上
class屬性
<p class=”applylarge applyred”>這是多重 Class 的例子。</p>
1.每個HTML元素都可以使用class屬性。2.有時候你想做的並非獨立識別文件中的單一元素,而是將幾個元素從其他元素中獨立出來。3.在任何元素上的class屬性都可以共用相同的值
CSS 的 class 和 id 兩者有何差異?
這兩者最大的不同,是在於 ID 選擇器在一個 HTML 文件中只能被使用一次,而 Class 選擇器在一個 HTML 文件中可以被使用多次。第二個不同的地方,是 ID 選擇器可以被 Javascript 中的 GetElementByID 函數所運用,而 Class 選擇器無法被 Javascript 運用到。並沒有什麼固定的規則,來決定什麼時候要用 ID 及什麼時候要用 Class。我們的建議是盡量用 Class,因為這樣子最靈活 (同一個 HTML 文件可以利用這類的選擇器多次)。唯一的例外,是當你要用 Javascript 的 GetElementByID 函數時。在這個情況下,你就應該要用 ID。做到好維護 id给js用,class给css用
相同Class 名稱及 ID 名稱都是對大小寫敏感的。舉例來說,.classone 及 .ClassOne 是代表兩個不同的 Class 選擇器。對於CSS而言,id和class都是選擇器,唯一不同的地方在於權重不同。同權重:
!important > id > class > tag
參考資料