CSS :only-child
selector selects every element that is the only child of its parent. It means that it will select only those elements which have no siblings.
For example, if you use p:only-child
, it will select every <p>
element that is the only child of its parent.
Here is an example:
Example:
p:only-child{ background-color: yellow; }
Here is another example which selects all <li>
elements that are the only child of their parent element. This parent element can be a <ul>
or an <ol>
.
Example:
li:only-child{ background-color: yellow; }
CSS Syntax
The syntax of the :only-child
selector is as follows:
:only-child{ CSS Styles; }
Browser Support
The number in each cell of the table specifies the first version of the browser that fully supports the :only-child
selector.
Selector | |||||
:only-child | 4.0 | 9.0 | 3.5 | 3.2 | 9.6 |