HTML is a pretty straightforward markup language. It has tags, each of which has optional attributes and sometimes required ones as well. Content goes between the opening and closing tags. Sometimes you can even self-close tags (but not <script> ! For the love of all things holy not script!). That’s about it — there are comments and a doctype (which is just a special comment in the scheme of things), and some quirks relating mostly to form element attributes, but the gist of html is tags with attributes.
How, then, can a more recently-updated language like CSS be going so off course?
Take, for example, this checkbox:
Here are some ways to target it using CSS:
Some of the “input”s in the list are superfluous, but I left them for illustrative purposes. Otherwise, it would be difficult to see that #receivenewsletter is really preceded by the universal selector for all intents and purposes.
I can sort of buy the full stop being shorthand for [class=””] and similarly the hash for an id (though in the development of CSS as a language, that’s not really wha happened), but the last example really bugs me.
Getting back to :checked — As far as I know, hovering does not create, destroy, or change attributes by default in a browser. On the other hand, checking a checkbox via an interface does create or remove a checked attribute. Therefore checked should be treated as an attribute using an attribute selector. Having the pseudo-class just muddies the issue.