CSS中的偽類和偽元素

2021-09-24 11:11:28 字數 843 閱讀 3759

2019獨角獸企業重金招聘python工程師標準》

偽類與類相似,但又沒有類附加標籤上。偽類分為ui偽類和結構化偽類。

偽元素是在文件中若有實無的元素。

主要有以下幾種

看到:after,大家腦子裡應該都能浮現出那個清除浮動的css的吧。沒錯,就是這個。

.clearfix:after
仔細琢磨下它們的定義。

偽類的實現就好比給這個標籤新增了乙個虛擬的類。

舉個栗子:

a:hover

hello,world

若不用偽類,實現同樣的效果,需要這麼做

.hover

hello,world

這麼一對比,」偽類「就顧名思義了啊。

而偽元素則好比新增了乙個新的標

籤。

p:first-letter

hello,world

若不用偽元素,實現同樣的效果,需要這麼做

.first-letter

hello,world

因此總結下區分的方法:現實相同效果是需要新增乙個類還是乙個元素標籤

tips:

1.css3為了區別偽類和偽元素,明確使用單冒號來表示偽類,雙冒號來表示偽元素。但為相容性考慮,目前基本還是使用單冒號來表示。

2.搜尋引擎不會搜尋偽元素的資訊。因此,不要通過偽元素新增你想讓搜尋引擎索引的重要內容

css中偽類和偽元素

偽類和偽元素時對那些我們不能通過class id等選擇元素的補充 偽類的操作物件是文件樹中已有的元素 可以給已有元素加了乙個類替代 而偽元素則建立了乙個文件數外的元素 可以新增乙個新元素替代 css3規範中要求使用雙冒號 表示偽元素,以此來區分偽元素和偽類。偽類 this is a text em ...

css中的偽類和偽元素

一 css偽類 pseudo class 是用來新增一些選擇器的特殊效果。由於狀態的變化是非靜態的,所以元素達到乙個特定狀態時,它可能得到乙個偽類的樣式 當狀態改變時,它又會失去這個樣式。由此可以看出,它的功能和class有些類似,但它是基於文件之外的抽象,所以叫偽類。偽類的語法 selector ...

css中的偽類和偽元素

2019獨角獸企業重金招聘python工程師標準 偽類與類相似,但又沒有類附加標籤上。偽類分為ui偽類和結構化偽類。偽元素是在文件中若有實無的元素。主要有以下幾種 看到 after,大家腦子裡應該都能浮現出那個清除浮動的css的吧。沒錯,就是這個。1 2 3 4 5 6 7 clearfix aft...