偽類用於向某些選擇器新增特殊的效果。
偽元素用於將特殊的效果新增到某些選擇器。
偽類有::first-child ,:link:,vistited,:hover,:active,:focus,:lang
偽元素有::first-line,:first-letter,:before,:after
使用偽類:
first如果我們不使用偽類,而希望達到上述效果,可以這樣做:second
不使用偽類:
first即我們給第乙個子元素新增乙個類,然後定義這個類的樣式。second
使用為元素:
i am stephen lee.那麼如果我們不使用偽元素,要達到上述效果,應該怎麼做呢?
不使用為元素:
i am stephen lee.即我們給第乙個字母新增乙個 span,然後給 span 增加樣式。
兩者的區別已經出來了。那就是:
偽類的效果可以通過新增乙個實際的類來達到,而偽元素的效果則需要通過新增乙個實際的元素才能達到,這也是為什麼他們乙個稱為偽類,乙個稱為偽元素的原因。
偽元素和偽類之所以這麼容易混淆,是因為他們的效果類似而且寫法相仿,但實際上 css3 為了區分兩者,已經明確規定了偽類用乙個冒號來表示,而偽元素則用兩個冒號來表示。
:pseudo-classes //偽類但因為相容性的問題,所以現在大部分還是統一的單冒號,但是拋開相容性的問題,我們在書寫時應該盡可能養成好習慣,區分兩者。::pseudo-elements //偽元素
css偽類和偽元素
css偽類用於向某些選擇器新增特殊的效果。link,visited,hover,focus,active,first child,lang css3新增的偽類 last child,only child,first of type,last of type,only of type,nth chil...
CSS偽類和偽元素
css引入偽類和偽元素概念是為了格式化文件樹以外的資訊。也就是說,偽類和偽元素是用來修飾不在文件樹中的部分,比如,一句話中的第乙個字母,或是列表中的第乙個元素,又或者是滑鼠懸停在某個超連結上時要設定的樣式。常見的狀態偽類主要包括 link 應用於未被訪問過的鏈結 hover 應用於滑鼠懸停到的元素 ...
偽類 偽元素 如何區分
前段時間在寫網頁的時候,使用了css的偽元素 after來實現樣式,故而重溫了一下偽類和偽元素。平時實現的時候便是拿出來用,但是真正區分兩者的概念的時候卻有點混淆了。首先,檢視一下w3s對偽類和偽元素的定義 偽類 用於向某些選擇器新增特殊效果。偽元素 向某些選擇器設定特殊效果。對於我這種理解能力比較...