僞類和僞元素的差別

在css2中是這樣定義二者的：

CSS 僞類用于向某些選擇器添加特殊的效果。

CSS 僞元素用于将特殊的效果添加到某些選擇器。

僞類存在的意義是為了通過選擇器找到那些不存在DOM樹中的資訊以及不能被正常CSS選擇器擷取到的資訊。

第一點講的是擷取不存在與DOM樹中的資訊。比如​

​<a>​

​标簽的:link、visited等，這些資訊不存在與DOM樹結構中，隻能通過CSS選擇器來擷取；

第二點講的是擷取不能被正常CSS選擇器擷取的資訊。比如僞類:target，它的作用是比對文檔(頁面)的URI中某個标志符的目标元素。

target:URL 帶有後面跟有錨名稱 #，指向文檔内某個具體的元素。這個被連結的元素就是目标元素(target element)。

:target 選擇器可用于選取目前活動的目标元素。

<ul>
    <li>123</li>
    <li></li>
</ul>      

li:first-child類似于

<ul>
    <li class="first-child">123</li>
    <li></li>
</ul>      

li.first-child 一樣

這個時候，被修飾的<li>元素依然處于文檔樹中。

<ul>
    123
</ul>      

ul:first-letter類似于

<ul>
    <span class="first-letter">1</li>
    23
</ul>      

ul:first-letter被修飾的時候，<span>元素并不處于文檔樹中。

是以，僞類與僞元素的差別在于：有沒有建立一個文檔樹之外的元素。

:first-child CSS僞類

代表了一組兄弟元素中的第一個元素。在level3實作中，被比對的元素需要具有一個父級元素，而在level4實作中則不需要

:first-child 比對的是某父元素的第一個子元素，可以說是結構上的第一個子元素。

p:first-child，常見的錯誤了解是這個選擇器是選擇p的第一個元素。

僞類的實質就是把某種幻想類關聯到某種僞類相關的元素中。

:first-of-type 比對的是該類型的第一個，類型是指什麼呢，就是冒号前面比對到的東西，比如 p:first-of-type，就是指所有p元素中的第一個。這裡不再限制是第一個子元素了，隻要是該類型元素的第一個就行了，當然這些元素的範圍都是屬于同一級的，也就是同輩的。

同樣類型的選擇器 :last-child 和 :last-of-type、:nth-child(n) 和 :nth-of-type(n) 也可以這樣去了解。

僞元素

僞元素包括:first-letter, :first-line, :before ,:after等

所有的僞元素都要寫在僞元素選擇器的最後面，如果這樣寫就會出錯，

p:first-letter em{
    
}      

這是不允許的。