僞類與僞元素的區別

CSS 引入僞類和僞元素的概念是爲了實現基於文檔樹之外的信息的格式化


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

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

僞元素用於將特殊的效果添加到某些選擇器。

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


可以明確兩點,第一兩者都與選擇器相關,第二就是添加一些“特殊”的效果。這裏特殊指的是兩者描述了其他 css 無法描述的東西。



僞元素和僞類之所以這麼容易混淆,是因爲他們的效果類似而且寫法相仿,但實際上 css3 爲了區分兩者,已經明確規定了僞類用一個冒號來表示而僞元素則用兩個冒號來表示

僞類和僞元素的根本區別在於:它們是否創造了新的元素(抽象)。

但因爲兼容性的問題,所以現在大部分還是統一的單冒號,但是拋開兼容性的問題,我們在書寫時應該儘可能養成好習慣,區分兩者。




發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章