一：偽類：
1:定義：css偽類用于向某些選擇器添加特殊效果。
偽類其實與普通的css類相類似，可以為已有的元素添加樣式，但是他只有處于dom無法描述的狀態下才能為文檔樹中的元素添加樣式，所以將其稱為偽類。

2:偽類選擇器有哪些:
1）:link向未被訪問的鏈接添加樣式（鏈接，看來是只用于<a>）
2）:visited向已被訪問過的鏈接添加樣式（鏈接，看來還是只用于<a>）
3）:hover當鼠標懸浮在元素上方時，向元素添加樣式（沒有特意指定必須是鏈接，所以這個標簽被大量用于定義任何一個塊/行元素在鼠標經過時的樣式）
4）:active向被激活的元素添加樣式（當鼠標點擊時的樣式，要注意是點擊時的樣式的變化，這個也不是只有超鏈接才能用的偽類選擇器）
5）:focus向擁有鍵盤輸入焦點的元素添加樣式（如input輸入框鼠標點擊時產生背景顏色的變化，注意是鍵盤輸入焦點。注意有些瀏覽器不支持此功能樣式）
6）:first-child 用于匹配父元素中的第一個元素。例如E:first-child,找的是E元素，E元素必須是他的父元素的第一位元素（擴展【：nth-child(n)】用于匹配父元素的第n個子元素E，這個父元素必須是元素E的父元素。）。
7）:lang向帶有指定lang屬性的元素添加樣式（在標簽中設置lang的屬性，在樣式表中對這種確切lang屬性值的元素進行樣式的設定，即使你有能力為不同的語言定義特殊的規則）
二：偽元素：
1:偽元素用于創建一些不在文檔樹中的元素，并且為他添加樣式，舉個例子：使用偽元素”：：before”可以在一個元素前邊增加一些文本，并且可以為這些文本添加一些樣式，雖然用戶可以看到這寫文本，但是這些文本是不存在于文檔樹中的。
2:幾種常見的偽元素：
1）:frist-letter用于向文本中的第一個字母添加樣式
2）:first-line向文本的首行添加樣式
3）:before在元素之前添加內容
4）:after在元素之后添加內容
三:偽元素和偽類的區別：
（1）偽類和偽元素的最大區別就在于有沒有創建一個文檔樹以外的元素。偽元素創建了一個文檔樹以外的元素（虛擬容器）并為他添加樣式，這個容器不包含任何DOM元素但是可以包含內容。換句話說偽類和偽元素的區別就是偽類的操作對象是文檔樹中已有的元素，而偽元素則創建了一個文檔樹以外的元素。
（2）偽類使用的是單冒號，但是在css3中規定偽元素使用的雙冒號，但是除了少部分的偽元素必須使用雙冒號以外，像after還有before都是支持單引號的。為了兼容性所以目前還是在使用一些常見的偽元素的時候采用單冒號較為穩妥。

轉載于:https://www.cnblogs.com/lal520/p/9786572.html

總結

以上是生活随笔為你收集整理的css中伪类与伪元素的区别的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。