What does this operator (::) in CSS mean? [duplicate]

Question

I have seen CSS like Custom Scrollbars in WebKit

body::-webkit-scrollbar {     width: 10px;     height: 13px;     background-color: white;     color: #EBEBEB;     border:none; } 

This specifies CSS for WebKit browsers. But what does this operator (::) mean in CSS?

Where can I find other such operators in CSS?

Answer 1

It indicates that what follows is a "pseudo-element". From the CSS Selectors level 3 spec:

A pseudo-element is made of two colons (::) followed by the name of the pseudo-element.

And a pseudo-element creates an "abstraction about the document tree":

Pseudo-elements create abstractions about the document tree beyond those specified by the document language. For instance, document languages do not offer mechanisms to access the first letter or first line of an element's content. Pseudo-elements allow authors to refer to this otherwise inaccessible information. Pseudo-elements may also provide authors a way to refer to content that does not exist in the source document (e.g., the ::before and ::after pseudo-elements give access to generated content).

For example, the ::webkit-scrollbar pseudo-element provides a mechanism to refer to the webkit scrollbar, which would be otherwise inaccessible. Another example: the ::first-letter pseudo-element provides a way to refer to the first letter of an element (if it is not preceded by any other content).