only-child (:only-child)

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;
}

Example

<!DOCTYPE html>
<html>
    <head>
        <style>
            span:only-child {
                color: red;
            }
        </style>
    </head>
    <body>
        <div>
            <span>This span is the only child of its father</span>
        </div>
        <div>
            <span>
            	This span is one of the two children of its father<br/>
			</span>
            <span>
            	This span is one of the two children of its father
			</span>
        </div>
    </body>
</html>