Style every <p> element that is the only child of its parent with CSS



Use the CSS :only-child selector to style every <p> element that is the only child of its parent.

Example

You can try to run the following code to implement the :only-child selector

Live Demo

<!DOCTYPE html> <html>    <head>       <style>          p:only-child {             background: orange;          }       </style>    </head>    <body>       <h1>Heading</h1>       <div>          <p>This is a paragraph.</p>       </div>       <div>          <p>This is a paragraph.</p>          <p>This is a paragraph.</p>          <p>This is a paragraph.</p>       </div>    </body> </html>

Output

Updated on: 2020-06-22T09:27:41+05:30

181 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements