Pseudo-element selectors are distinguished from pseudo-class selectors by the fact that the latter affect elements when they are in particular states (for example, a:hover controlling the appearance of links when the mouse is over them). Pseudo-element selectors control the appearance of portions of an element’s content, such as the first line or letter of a paragraph.

With CSS3, the W3C instituted the convention that pseudo-element selectors should be preceded by two colons, to distinguish them from pseudo-class selectors, which get just one. In theory, modern browsers should recognize this rule, and they do… except for IE6 – 8. Also in theory, browsers should honour single colons in front of pseudo-element selectors that were present in CSS1 and 2, but I’ve found that certain browser versions do not. Personally, I’d go with the W3C recommendation.

As before, I’ve linked to articles in the blog where appropriate.