CSS :target Selector - HTML CSS CSS Selector

HTML CSS examples for CSS Selector:target

  1. HOME
  2. HTML CSS
  3. CSS Selector
  4. target

Description

CSS :target Selector

Demo Code

ResultView the demo in separate window 

<html lang="en">
 <head> 
  <title>Lorem ipsum dolor sit </title> 
  <style>
.menu {<!-- w  ww  .j a  v a2s  .c  om-->
   display:none;
}

.menu:target {
   display:block;
}
</style> 
 </head> 
 <body translate="no"> 
  <div id="selectors"> 
   <ul> 
    <li> <a href="#newmenu">Lorem i</a> </li> 
    <li> <a href="#menu">Lore</a> </li> 
   </ul> 
  </div> 
  <div id="content"> 
   <ul class="menu" id="newmenu"> 
    <li> <a href="#">Lorem </a> </li> 
    <li> <a href="#">Lorem ipsum</a> </li> 
    <li> <a href="#">Lorem ipsu</a> </li> 
   </ul> 
   <ul class="menu" id="menu"> 
    <li> <a href="#">Lorem ipsu</a> </li> 
    <li> <a href="#">Lorem ipsum</a> </li> 
    <li> <a href="#">Lorem ipsu</a> </li> 
   </ul> 
  </div> 
 </body>
</html>

Related Tutorials