pseudo-class和pseudo-element的異同
阿新 • • 發佈：2018-10-25
tar type rst html get -c 狀態 ive pro
CSS 偽元素用於向某些選擇器設置特殊效果
語法：
selector:pseudo-element {property:value;}
與偽元素配合使用
selector.class:pseudo-element {property:value;}
相同點：
兩者均以selector：或者selector.class：的形式開頭。
不同點：
偽類用於選擇DOM樹之外的信息，或是不能用簡單選擇器進行表示的信息。前者包含那些匹配指定狀態的元素，比如:visited，:active；後者包含那些滿足一定邏輯條件的DOM樹中的元素，比如:first-child，:first-of-type，：target。
而偽元素為DOM樹沒有定義的虛擬元素。不同於其他選擇器，它不以元素為最小選擇單元，它選擇的是元素指定內容。比如::before表示選擇元素內容的之前內容，也就是""；::selection表示選擇元素被選中的內容。
<html>
<head>
<style>
p:first-child
{
color:blue;
}
</style>
</head>
<body>
<p>第一行將產生顏色效果</p>
<p>原效果</p>
</body>
</html>
pseudo-class和pseudo-element的異同