CSS selector applying style to only parent link - 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

CSS selector applying style to only parent link

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">
.sidebar .nav.sidenav>li>a {
   background-color:Chartreuse;
   border-right:2px solid yellow;
   color:blue;
   font-weight:bold;
}
</style> <!--from w  w w.ja v a 2  s . c om-->
 </head> 
 <body> 
  <div class="sidebar"> 
   <ul class="nav sidenav"> 
    <li> <a href="#">Lorem</a> 
     <ul class="nav"> 
      <li> <a href="#">Lorem</a> </li> 
     </ul> </li> 
    <li> <a href="#">Lorem</a> 
     <ul class="nav"> 
      <li> <a href="#">Lorem</a> </li> 
     </ul> </li> 
   </ul> 
  </div>  
 </body>
</html>

Related Tutorials