Tại sao có hai dấu hai chấm ở đây? khoảng :: trước

Question

Đây là dòng đầy đủ của mã Tôi đang nhìn vào, và đây là bối cảnh của nó: http://acidmartin.wordpress.com/2011/02/24/custom-crossbrowser-styling-for-checkboxes-and-radio-buttons

input[type="radio"] + span::before { content: ""; display: inline-block; width: 20px; height: 20px; background: url("sprite.png") no-repeat -20px 0; vertical-align: middle; } 

Tôi có một sự hiểu biết phong nha của cách làm việc này, nhưng tôi không hiểu tại sao có hai dấu hai chấm, thay vì một dấu hai chấm và trước.

Bộ chọn trước, từ nội dung tôi đã đọc nên sử dụng một dấu hai chấm.

http://www.w3schools.com/cssref/sel_before.asp

On w3c, tôi không thể tìm thấy bất kỳ selectors có hai dấu hai chấm, cũng không phải tôi có thể tìm ra lý do tại sao khoảng thời gian sẽ có một dấu hai chấm sau nó, ngoài đại tràng trước "trước khi".

http://www.w3.org/TR/CSS2/selector.html

Answer 1

Đó là một giả yếu tố, theo quy định của CSS Selectors Level 3 spec:

Các ::before và ::after giả yếu tố có thể được sử dụng để mô tả nội dung được tạo ra trước hoặc sau khi nội dung của một nguyên tố .

Nó có hiệu quả giống như cú pháp một dấu hai chấm được xác định bởi thông số cấp 2. Đặc tả cấp 3 giới thiệu một dấu hai chấm để phân biệt giữa các phần tử giả và các lớp giả (sử dụng một dấu hai chấm đơn).

Cả hai cú pháp sẽ hoạt động trong các trình duyệt mới hơn, nhưng các trình duyệt cũ hơn sẽ không nhận ra kiểu :: mới hơn.

---

Đối với chi tiết hơn nữa, bạn có thể ghé qua grammar từ cấp 3 spec, trong đó nêu:

'::' bắt đầu một pseudo-element, ':' một pseudo-class

Answer 2

Bạn có thể đọc một bài viết về nó here

Nhưng về cơ bản nó là để phân biệt giữa các lớp giả và các yếu tố giả. Nó là một tiêu chuẩn css3 để sử dụng hai dấu hai chấm cho một phần tử giả, như trái ngược với tiêu chuẩn CSS2 chỉ là một.

Một hoặc hai dấu hai chấm sẽ hoạt động khi trình duyệt muốn phục vụ cho cả CSS2 và CSS3