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

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

轉(zhuǎn)載于:https://www.cnblogs.com/lal520/p/9786572.html

總結(jié)

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

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。