Menu
::after (:after) In CSS, ::after creates a pseudo-element that is the last child of the selected element. It is often used to add cosmetic content to an element with the content property. It is inline by default.
A CSS pseudo-element is a keyword added to a CSS selector that lets you style a specific part of the selected HTML element. In CSS3, they are usually denoted by two colons — for example, ::first-line — to differentiate them from pseudo-classes. In contrast, CSS2 syntax uses one colon (e.g., :first-line ).
The ::before selector inserts something before the content of each selected element(s). Use the content property to specify the content to insert. Use the ::after selector to insert something after the content.
The double colon ( :: ) may refer to: an analogy symbolism operator, in logic and mathematics. a notation for equality of ratios. a scope resolution operator, in computer programming languages.
It means pseudo element selector. It means the element to the right doesn't exist in the normal DOM, but can be selected.
A pseudo-element is made of two colons (::) followed by the name of the pseudo-element.
Source
It was originally only a single colon, but was changed to differentiate it from pseudo classes (like :hover, :first-child, :not etc). It's best to use : for before and after pseudo elements since the single colon has better browser support, namely in earlier IE versions.
The :: operator indicates you are selecting a pseudo element, one which does not actually exist as an element but can still be targeted for styling.
Example of this include several vendor-specific implementations such as the -ms-clear sample you provide, most browsers also have pseudo elements to style scroll bars and other native UI elements, but there are also a lot of predefined pseudo elements which can be referenced for practical reasons, such as first-line and first-letter.
The :before and :after pseudo elements even allow you to insert actual content into the page using CSS with the content rule.
CSS3 changes the way pseudo-elements are selected, as the W3C wanted to distinguish pseudo-classes like a:visited from pseudo-elements like p::first-line. See Advanced CSS Selectors.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With