聲明：本欄目所使用的素材都是凱哥學堂VIP學員所寫，學員有權匿名，對文章有最終解釋權；凱哥學堂旨在促進VIP學員互相學習的基礎上公開筆記。
選擇器中的屬性： 之前介紹過[ ]里可以定義屬性或屬性值，之后的標簽中只要含有該定義的屬性或屬性值就會擁有該樣式。所以繼續介紹剩下的幾種聲明方式。 1.[attribute=value]，例如：[title=”abc”]，選擇只要是title屬性值以abc開頭的每個標簽，就賦予這個樣式，示例：
運行結果：
2.[attribute$=value]，例如：[title$=”123”]，選擇只要是title屬性值以123結尾的每個標簽，就賦予這個樣式，示例：
運行結果：
3.[attribute*=value]，例如：[title*=”abc”]，選擇只要是title屬性值包含abc字符串的每個標簽，就賦予這個樣式，示例：
運行結果：
思維導圖：
超級鏈接的狀態樣式：
超級鏈接有四個狀態的樣式：
1.從來沒有被訪問過的超級鏈接，
2.2.已經被訪問過的超級鏈接，
3.3.鼠標移動到超級鏈接時的狀態，
4.4.鼠標點擊超級鏈接時的狀態。
每一個狀態都可以設置不同的樣式：
a:link 設置從來沒有被訪問過的超級鏈接樣式
a:visited 設置已經被訪問過的超級鏈接樣式
a:hover 設置鼠標移動到超級鏈接時的樣式
a:active 設置鼠標點擊超級鏈接時的樣式
代碼示例：
運行結果：
思維導圖：
焦點獲得時改變樣式：
input:focus 可以定義在組件獲得焦點時改變樣式
代碼示例：
運行結果：
設置子標簽樣式：
:last-child 設置父標簽最后一個子標簽的樣式，例如：div p:last-child，設置div標簽里最后一個p標簽的樣式
:first-child 則是相反，設置父標簽最第一個子標簽的樣式，例如：div p:first-child，設置div標簽里第一個p標簽的樣式
代碼示例：
運行結果：
:nth-of-type(n)，設置父標簽從第一個開始數的第n個子標簽的樣式，例如：div p:nth-of-type(2)，就是設置div標簽里第二p標簽的樣式
:nth-last-of-type(n)，設置父標簽從倒數第一個開始數的第n個子標簽的樣式，例如：div p:nth-of-type(1)，就是設置div標簽里倒數第一個p標簽的樣式
代碼示例：
運行結果：
利用:nth-of-type(n)可以做到隔行變色的效果，應用在表格上代碼示例：
運行結果：
