English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

CSS Reference Manual

CSS @rules

Complete List of CSS Properties

CSS3 :empty Selector

:empty CSS pseudo-class represents elements that do not have any child elements. Child elements can only be element nodes or text (including spaces).

Complete CSS Selector Reference Manual

Online Example

Specify the background color of an empty div element:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>Basic Tutorial(oldtoolbag.com)</title> 
<style>
.box {
    background: pink;
    height: 80px;
    width: 80px;
     margin:10px;
}
.box:empty {
    background: lime;
}
</style>
</head>
<body>
<div class="box"><!-- My color is green --></div>
<div class="box">My background color is pink</div>
<div class="box">
    <!-- I will be red because the content around this box is blank -->
</div>
</body>
</html>
Test and see ‹/›

Definition and Usage

:empty

:empty selector selects each element that has no child elements (including text nodes).

Browser Compatibility

The numbers in the table indicate the first browser version number that supports this attribute.

Selector




:empty4.09.03.53.29.6

Complete CSS Selector Reference Manual