CSS 的虛擬類別 (Pseudo Class) 和虛擬元素 (Pseudo Element)
虛擬類別 (Pseudo Class) 的執行對象是文件樹中已有的元素，而虛擬元素 (Pseudo Element) 則新增了一個文件樹外的元素。兩者的差別在於：有沒有新增一個文件樹外的元素。
※ ::before (:before) 與 ::after (:after) 一定要具備 content 的屬性。
虛擬類別 (Pseudo Class)
用於向某些選擇器添加特殊的效果，使用一個冒號「:」開頭。一、錨點虛擬類別
- :link
- :visited
- :hover
- :active
二、狀態虛擬類別
:checked、unchecked、:enabled、:disabled三、-child
- :first-child：第一個子元素
- :last-child：最後一個子元素
- :nth-child(數字)：第幾個子元素 (從 1 數起，不是從 0)
- :nth-child(2n)：偶數的子元素 (2 的倍數)
- :nth-child(2n+1)：奇數的子元素
- :nth-last-child(數字)：從後面數來第幾個子元素
- :only-child：父元素內只有一個子元素
四、-of-type
- :first-of-type：同一種元素的第一個
- :last-of-type：同一種元素的最後一個
- :nth-of-type(數字)：同一種元素裏頭的第幾個
- :nth-last-of-type(數字)：同一種元素從後面屬過來第幾個
- :only-of-type：只有這種元素
虛擬元素 (Pseudo Element)
用於將特殊的效果添加到某些選擇，使用兩個冒號「::」開頭。虛擬元素和真實元素一樣，我們可以把它當做 HTML 中常用的元素來使用，但它只能利用 CSS 來產生，而且並不在文件樹中，所以無法對他們進行分類。::before (:before)
在原本的元素「之前」加入內容，以 display:inline-block 的屬性存在。::after(:after)
在原本的元素「之後」加入內容，以 display:inline-block 的屬性存在。※ ::before (:before) 與 ::after (:after) 一定要具備 content 的屬性。
留言