CSS "::" vs ":" - phần tử giả vs bộ chọn giả?

Question

Tôi đang nghiên cứu css và typography, và chạy vào khái niệm hấp dẫn này của các bộ chọn giả. Tôi đã sử dụng bộ chọn psuedo ruột già duy nhất và không quen thuộc với phiên bản hai dấu hai chấm của bộ chọn psuedo. I understand rằng dấu hai chấm được gọi là phần tử giả thay vì một bộ chọn giả - nhưng tại sao? Và sự khác biệt là gì?

Tôi cũng hiểu rằng dấu hai chấm đơn được hỗ trợ nhiều hơn, vì vậy trong trường hợp nào thì người ta sẽ sử dụng phần tử giả đại tràng kép? Có những trường hợp sử dụng trong đó hai dấu hai chấm là cần thiết, và dấu hai chấm đơn lẻ sẽ không hoàn thành công việc? tình huống đó có thể là gì?

"Không giống như các phần tử giả, các lớp giả có thể xuất hiện ở bất kỳ vị trí nào trong chuỗi chọn". (Trích dẫn từ liên kết) - Tôi không biết 'chuỗi chọn' là gì, nhưng điều này cũng có vẻ như là một hạn chế khác của cách tiếp cận hai dấu hai chấm. Tại sao tôi cần phải sử dụng dấu hai chấm nếu nó là (trong sự hiểu biết của tôi) chỉ là một phiên bản ít được hỗ trợ của dấu hai chấm đơn?

chỉnh sửa: chúng xuất hiện không phải là chức năng giống nhau: fiddle

<div><p>First Line</p></div> 
<div><p>Second Line</p></div> 

css

div:nth-child(1) > p { 
    color: green; 
} 

div::nth-child(2) > p { 
    color: blue; 
} 

Answer 1

Giả lớp (:) cho phép bạn tạo kiểu cho tiểu bang khác nhau của một phần tử ví dụ khi bạn di chuột qua nó, khi nó bị vô hiệu hóa, khi nó là con đầu tiên của cha mẹ, v.v.

Các phần tử giả (::) cho phép bạn tạo kiểu các phần khác nhau của một phần tử, ví dụ: dòng đầu tiên, chữ cái đầu tiên, chèn nội dung trước hoặc sau, v.v.

Ban đầu, tất cả đều sử dụng một dấu hai chấm, nhưng CSS3 đã giới thiệu dấu hai chấm để tách hai.