HTML and CSS Reference
In-Depth Information
Figure 13-12.
The field changes color to indicate an invalid value
styling form elements based on their state provides a useful visual clue about the validity of data input. At
the time of this writing, browser support is incomplete and slightly inconsistent. so, it's important to test
thoroughly before deploying the pseudo-classes listed in Table
13-4
.
Selecting Elements Based on Negative Factors
The two pseudo-classes listed in Table
13-5
select elements based on negative factors. They are supported by all
modern browsers except IE 8 and earlier.
Table 13-5.
Pseudo-classes Based on Negative Factors
Pseudo-class
Description
:not()
Matches elements based on a negative condition.
:empty
Matches elements that have no content. To be empty, an element cannot even have
whitespace between the opening and closing tags.
To use the
:not()
pseudo-class, you place a simple selector as the condition between the parentheses. The
condition must be one of the following:
•
The universal selector (*)
•
A type selector
•
An attribute selector
•
A class or pseudo-class
•
For example, using the
:first-child
pseudo-class as the condition in the following selector matches all
table rows, except the first:
An ID selector.
tr:not(:first-child)
Similarly, the following selector matches all table cells, except the last one in each row:
td:not(:last-child)
