Selecting nested first child element without sibling with css - HTML CSS CSS Selector

HTML CSS examples for CSS Selector:element parent child

  1. HOME
  2. HTML CSS
  3. CSS Selector
  4. element parent child

Description

Selecting nested first child element without sibling with css

Demo Code

ResultView the demo in separate window 

<html>
 <head> 
  <meta name="viewport" content="width=device-width, initial-scale=1"> 
  <style id="compiled-css" type="text/css">
#foo p:first-of-type {
   background-color:Chartreuse;
}
</style> <!--from  w w  w.j  a va2 s .  c o m-->
 </head> 
 <body> 
  <div id="foo"> 
   <div></div> 
   <h1>Lorem ipsum dolor</h1> 
   <p>Lorem ipsum dolor sit amet, co</p> 
   <p>Lorem ipsum dolor sit amet, cons</p> 
  </div>  
 </body>
</html>

Related Tutorials