The :only-child CSS pseudo-class represents any element which is the only child of its parent. This is the same as :first-child:last-child or :nth-child(1):nth-last-child(1), but with a lower specificity.
Syntax
parent child:only-child {
property: value;
}
Examples
Basic example
1
span:only-child {
2
color: red;
3
}
1
<div>
2
<span>This span is the only child of its father</span>
3
</div>
4
<div>
5
<span>This span is one of the two children of its father</span>
6
<span>This span is one of the two children of its father</span>
7
</div>
Reference result
This span is the only child of its father
This span is one of the two children of its father
This span is one of the two children of its father