<!DOCTYPE html> <html> <head> <style> div p{ /* descendant selector */ color:red; font-size:18px; background-color:lightgray; } aside > q{ /* child selector */ background-color:lightgreen; color:blue; } </style> </head> <body> <div> <p>I am child.</p> </div> <div> <code><p>I am grand child.</p></code> </div> <aside> <q>I am child.</q> </aside> <aside> <p><q>I am grandchild.</q></p> </aside> <p><strong>Note:</strong> what is working and what is not working.</p> </body> </html> <!DOCTYPE html> <html> <head> <style> div p{ /* descendant selector */ color:red; font-size:18px; background-color:lightgray; } aside > q{ /* child selector */ background-color:lightgreen; color:blue; } </style> </head> <body> <div> <p>I am a child.</p> </div> <div> <code><p>I am a grandchild.</p></code> </div> <aside> <q>I am a child.</q> </aside> <aside> <p><q>I am a grandchild.</q></p> </aside> <p><strong>Note:</strong> what is working and what is not working.</p> </body> </html>
Run
×
Share