僞類和僞元素的區別

在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{
    
}

這是不容許的。