Menu
This is a bit of a pedantic question, but perhaps worth asking. Is there, mechanically, a difference between a pseudo-class and a pseudo-selector in CSS? We use the term interchangeably around here, but it seems that there's a reason for the two terms. Is there any use to differentiating the two?
400
Pseudo-classes enable you to target an element when it's in a particular state, as if you had added a class for that state to the DOM. Pseudo-elements act as if you had added a whole new element to the DOM, and enable you to style that.
The Difference Between Pseudo-classes and Pseudo-elements of CSS Properties. First, Let's have a look at the definition of Pseudo-classes and Pseudo-elements from W3C: CSS Pseudo-classes are used to add special effects to some selectors. CSS Pseudo-elements are used to add special effects to specific selectors.
A CSS pseudo-class is a keyword added to a selector that specifies a special state of the selected element(s). For example, the pseudo-class :hover can be used to select a button when a user's pointer hovers over the button and this selected button can then be styled.
CSS pseudo-classes are used to add styles to selectors, but only when those selectors meet certain conditions. A pseudo class is expressed by adding a colon (:) after a selector in CSS, followed by a pseudo-class such as "hover", "focus", or "active", like this: a:hover { /* your style here */ }
A pseudo-class is a specified thing, while pseudo-selector is a made up word.
(Meanwhile, a pseudo-class matches an element when certain conditions are met (e.g. the mouse is pointing at it, or it is the first child of its parent), while a pseudo-element is something that can be matched but isn't a real or whole element, such as "Thing before an element" or "First line of text in an element".)
59
pseudo-selector does make the odd appearance on the W3C site, but my initial search suggests that it is an old old term that has now been replaced with pseudo-class:
pseudo-selector
the page pseudo-selector :first
http://www.w3.org/TR/2004/CR-css-print-20040225/#section-selectors
CSS has a "lang" pseudo-selector that automatically uses the appropriate attribute depending on the media type
http://www.w3.org/TR/xhtml-media-types/
pseudo-class
5.11.4 The language pseudo-class: :lang
http://www.w3.org/TR/CSS2/selector.html#lang
...and many more.
Pseudo-elements and pseudo-classes
Then there's the descriptions for pseudo-elements and pseudo-classes:
http://www.w3.org/TR/CSS2/selector.html#pseudo-elements
So it looks to me as though pseudo-selectors are no longer in vogue...
28
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
