What is empty in CSS?

How to use empty css selector?

CSS :empty is the pseudo-class selector. If you will use any element and left any text or content then it will be an empty element. Also, If we are using comment in the any element then it will show as an empty element. below is the code for the css empty class.

<style> 

        p:empty {

          background: red;

          width: 150px;

          height: 30px;

        }

        div:empty {

          background: green;

          width: 200px;

          height: 50px;

        }

  </style>    

        

        <p>I am paragraph.</p>

        <p></p>

        <p>Other paragraph.</p>

        

        <div></div>

        <div>Learn anything</div>

        <br>

        <div><!-- this is html comment  --></div>