Hello! I’m Doctor Peter and I’m here to treat you with a dose of complementary CSS3. Don’t worry, this won’t hurt a bit.
Contrary to what HTML5 Please and the W3C would have you believe, CSS3 is not part of HTML5. “But this is HTML5 Doctor,” I imagine you saying. “Why are you talking about CSS3 here?” Well, I want to talk about a very specific part of CSS3, one that works in perfect tandem with HTML5, specifically with the new form functions that are available.
A pseudo-class is information about an element that’s in the document tree but not available through any specified attributes. For example, the :first-child pseudo-class applies to elements which are the first child of their parents. You can get that information from the DOM tree, but there’s no first-child attribute.
In CSS2.1, there were a handful of pseudo-classes available, notably the link states ( :link , :visited ) and those of user actions ( :active , :hover ). In CSS3, that handful becomes a basketful, with pseudo-classes of structure ( :nth-child , :nth-of-type ), UI element ( :enabled , :checked ), and the ones we’ll look at now, of form validation.