一，偽類(Pseudo-classes)

為選擇器新增更多的效果

偽類選擇元素基於的是當前元素處於的狀態，或者說元素當前所具有的特性，而不是元素的id、class、屬性等靜態的標誌。由於狀態是動態變化的，所以一個元素達到一個特定狀態時，它可能得到一個偽類的樣式；當狀態改變時，它又會失去這個樣式。由此可以看出，它的功能和class有些類似，但它是基於文件之外的抽象，所以叫偽類

二，偽元素

偽元素是對元素中的特定內容進行操作，它所操作的層次比偽類更深了一層，也因此它的動態性比偽類要低得多。實際上，設計偽元素的目的就是去選取諸如元素內容第一個字（母）、第一行，選取某些內容前面或後面這種普通的選擇器無法完成的工作。它控制的內容實際上和元素是相同的，但是它本身只是基於元素的抽象，並不存在於文件中，所以叫偽元素

• 1，偽元素

• 2，適用於偽元素的屬性

1. font properties
2. color properties 
3. background properties
4. margin properties
5. padding properties
6. border properties
7. text-decoration
8. vertical-align (only if "float" is "none")
9. text-transform
10. line-height
11. float
12. clear

• 3，示例：

  • p:first-letter
    {
        color:#ff0000;
        font-size:xx-large;
    }
    //段落的第一個字母將顯示為紅色，其字型大小為 xx-large

     

三，a標籤 （link連結）

1. 四個狀態
   1. a:link {color:#000000;} /* 未訪問連結*/
   2. a:visited {color:#00FF00;} /* 已訪問連結 */
   3. a:hover {color:#FF00FF;} /* 滑鼠移動到連結上 */
   4. a:active {color:#0000FF;} /* 滑鼠點選時 */
2. 順序規則
   1. a:hover 必須跟在 a:link 和 a:visited後面
   2. a:active 必須跟在 a:hover後面