Role of CSS :empty Selector



Use the CSS :empty selector to style every <p> element that has no children with CSS. You can try to run the following code to implement the :empty selector −

Example

Live Demo

<!DOCTYPE html> <html>    <head>       <style>          p.demo {             width: 300px;             height: 20px;             background: gray;           }           p:empty {              width: 150px;              height: 20px;              background: orange;          }       </style>    </head>    <body>       <p class = "demo">This is demo text. Below is empty text.</p>       <p></p>    </body> </html>
Updated on: 2020-06-30T09:49:59+05:30

214 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements