Pseudo-element là gì?

Pseudo-element được sử dụng để style cho các phần của 1 phần tử (element). Ví dụ như style dòng đầu tiên của thẻ p bằng selector là: p:first-line

Pseudo-element không giống như pseudo-class. Trong khi pseudo-class khớp (match) với các phần tử thực sự tồn tại, pseudo-class nhắm mục tiêu đến các phần tử “ảo” có thể thay đổi tùy thuộc vào HTML thực tế. Pseudo-element trong CSS2 sử dụng dấu hai chấm đơn (single colon) và pseudo-element trong CSS3 sử dụng dấu hai chấm kép ( double colon). Trong ví dụ bên dưới, rule set đầu tiên sử dụng pseudo-element trong CSS2 và rule set thứ hai sử dụng pseudo-element trong CSS3:

/* "first-letter" including the preceding colon is the pseudo-element */
p:first-letter {
  display: block;
  float: left;
  margin: 0 5px 5px 0;
}

/* CSS3 pseudo-elements have double colons */
::selection {
  background: green;
}